Skip to content

MSF / msf-climate-hub

Go to a project
Toggle navigation
Toggle navigation pinning
7b99a648 by Jeff Balicki
Options

desktop -v2 

Signed-off-by: Jeff <jeff@gotenzing.com>
1 parent 4aee2f3f
Inline Side-by-side
Showing 30 changed files with 751 additions and 301 deletions
...@@ -56,16 +56,13 @@ $carousel_style = get_field('carousel_style'); ...@@ -56,16 +56,13 @@ $carousel_style = get_field('carousel_style');
56 } 56 }
57 ?> 57 ?>
58 <img src="<?php echo $image; ?>" alt="<?php echo $img_alt ?>" loading="eager"> 58 <img src="<?php echo $image; ?>" alt="<?php echo $img_alt ?>" loading="eager">
59 <div class="promo-text"><a class="understrap-read-more-link" href="<?php echo get_permalink($page->ID);?>"><?php the_title($page->ID); ?></a></div>
60 </div> 59 </div>
61 60 <div class="promo-text"><a class="understrap-read-more-link" href="<?php echo get_permalink($page->ID);?>"><?php echo get_the_title($page->ID); ?></a></div>
62 </div> 61 </div>
63 </div> 62 </div>
64 </div> 63 </div>
65 <?php endwhile; ?> 64 <?php endwhile; ?>
66 </div> 65 </div>
67 <div class="swiper-pagination"></div>
68
69 <div class="swiper-button-prev" data-id="<?= $id ?>"></div> 66 <div class="swiper-button-prev" data-id="<?= $id ?>"></div>
70 <div class="swiper-button-next" data-id="<?= $id ?>"></div> 67 <div class="swiper-button-next" data-id="<?= $id ?>"></div>
71 </div> 68 </div>
......
...@@ -14992,6 +14992,8 @@ body { ...@@ -14992,6 +14992,8 @@ body {
14992 14992
14993 .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl { 14993 .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
14994 max-width: 1067px !important; 14994 max-width: 1067px !important;
14995 padding-right: 0px;
14996 padding-left: 0px;
14995 } 14997 }
14996 14998
14997 /** Wednesday 26th July 2023 02:16:49 UTC (core) **/ 14999 /** Wednesday 26th July 2023 02:16:49 UTC (core) **/
...@@ -16745,7 +16747,7 @@ html.mega-menu-primary-off-canvas-open #wpadminbar { ...@@ -16745,7 +16747,7 @@ html.mega-menu-primary-off-canvas-open #wpadminbar {
16745 #mega-menu-wrap-primary { 16747 #mega-menu-wrap-primary {
16746 width: 100%; 16748 width: 100%;
16747 height: 1.875rem; 16749 height: 1.875rem;
16748 top: 3.4375rem; 16750 top: 2.4375rem;
16749 right: 0rem; 16751 right: 0rem;
16750 position: absolute; 16752 position: absolute;
16751 background: transparent; 16753 background: transparent;
...@@ -16756,8 +16758,8 @@ html.mega-menu-primary-off-canvas-open #wpadminbar { ...@@ -16756,8 +16758,8 @@ html.mega-menu-primary-off-canvas-open #wpadminbar {
16756 #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-blocks-right .mega-toggle-block:only-child { 16758 #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-blocks-right .mega-toggle-block:only-child {
16757 background-color: #EE0000; 16759 background-color: #EE0000;
16758 border-radius: 50%; 16760 border-radius: 50%;
16759 width: 2.5rem; 16761 width: 35px;
16760 height: 2.5rem; 16762 height: 35px;
16761 margin-right: 0.9375rem; 16763 margin-right: 0.9375rem;
16762 } 16764 }
16763 #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-blocks-right .mega-toggle-block:active:only-child { 16765 #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-blocks-right .mega-toggle-block:active:only-child {
...@@ -16866,6 +16868,12 @@ html.mega-menu-primary-off-canvas-open #wpadminbar { ...@@ -16866,6 +16868,12 @@ html.mega-menu-primary-off-canvas-open #wpadminbar {
16866 margin: 0rem 0 0 0.3813rem; 16868 margin: 0rem 0 0 0.3813rem;
16867 line-height: 2.5rem; 16869 line-height: 2.5rem;
16868 } 16870 }
16871 @media only screen and (max-width: 62.5rem) {
16872 #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-block-3:after {
16873 line-height: 35px;
16874 font-size: 23px;
16875 }
16876 }
16869 16877
16870 #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:hover > a { 16878 #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:hover > a {
16871 background-color: #669999 !important; 16879 background-color: #669999 !important;
...@@ -16900,14 +16908,15 @@ html.mega-menu-primary-off-canvas-open #wpadminbar { ...@@ -16900,14 +16908,15 @@ html.mega-menu-primary-off-canvas-open #wpadminbar {
16900 padding-left: 1.6875rem; 16908 padding-left: 1.6875rem;
16901 margin-left: 30px; 16909 margin-left: 30px;
16902 text-decoration: none; 16910 text-decoration: none;
16911 width: calc(100% - 127px);
16903 } 16912 }
16904
16905 .branding { 16913 .branding {
16906 display: flex; 16914 display: flex;
16907 margin-bottom: 0rem; 16915 margin-bottom: 0rem;
16908 margin-top: 0.9375rem; 16916 margin-top: 0.9375rem;
16909 z-index: 999; 16917 z-index: 999;
16910 position: relative; 16918 position: relative;
16919 width: 100%;
16911 } 16920 }
16912 .branding .navbar-brand { 16921 .branding .navbar-brand {
16913 margin-right: 0px; 16922 margin-right: 0px;
...@@ -16925,6 +16934,11 @@ html.mega-menu-primary-off-canvas-open #wpadminbar { ...@@ -16925,6 +16934,11 @@ html.mega-menu-primary-off-canvas-open #wpadminbar {
16925 #main-nav { 16934 #main-nav {
16926 box-shadow: 0rem 0.1875rem 0.375rem rgba(0, 0, 0, 0.1607843137); 16935 box-shadow: 0rem 0.1875rem 0.375rem rgba(0, 0, 0, 0.1607843137);
16927 } 16936 }
16937 @media only screen and (max-width: 48.875rem) {
16938 #main-nav {
16939 height: 90PX;
16940 }
16941 }
16928 16942
16929 #main-nav .container { 16943 #main-nav .container {
16930 flex-direction: column; 16944 flex-direction: column;
...@@ -16933,21 +16947,24 @@ html.mega-menu-primary-off-canvas-open #wpadminbar { ...@@ -16933,21 +16947,24 @@ html.mega-menu-primary-off-canvas-open #wpadminbar {
16933 } 16947 }
16934 @media only screen and (max-width: 62.5rem) { 16948 @media only screen and (max-width: 62.5rem) {
16935 #main-nav .container { 16949 #main-nav .container {
16936 height: 5.625rem; 16950 height: 90px;
16937 padding-top: 1.5625rem; 16951 padding-top: 0px;
16938 margin-bottom: 0rem; 16952 margin-bottom: 0rem;
16939 } 16953 }
16940 } 16954 }
16941 16955
16942 @media only screen and (max-width: 62.5rem) { 16956 @media only screen and (max-width: 62.5rem) {
16943 .branding { 16957 .branding {
16944 margin-top: 0rem; 16958 margin-top: 6px;
16959 padding-left: 15px;
16945 } 16960 }
16946 .site-title { 16961 .site-title {
16947 font-size: 1.25rem; 16962 font-size: 1.25rem;
16948 line-height: 1.5rem; 16963 line-height: 1.5rem;
16949 margin-left: 0rem; 16964 margin-left: 0rem;
16950 padding-left: 1.2rem; 16965 padding-left: 1.2rem;
16966 height: 33px;
16967 align-self: end;
16951 } 16968 }
16952 .navbar-brand { 16969 .navbar-brand {
16953 width: 8.125rem; 16970 width: 8.125rem;
...@@ -16979,6 +16996,11 @@ html.mega-menu-primary-off-canvas-open #wpadminbar { ...@@ -16979,6 +16996,11 @@ html.mega-menu-primary-off-canvas-open #wpadminbar {
16979 z-index: 99; 16996 z-index: 99;
16980 top: 0rem; 16997 top: 0rem;
16981 } 16998 }
16999 @media only screen and (max-width: 48.875rem) {
17000 #wrapper-navbar {
17001 height: 90px;
17002 }
17003 }
16982 17004
16983 .admin-bar #wrapper-navbar { 17005 .admin-bar #wrapper-navbar {
16984 top: 2rem; 17006 top: 2rem;
...@@ -17945,9 +17967,9 @@ p { ...@@ -17945,9 +17967,9 @@ p {
17945 } 17967 }
17946 17968
17947 .badge { 17969 .badge {
17970 opacity: 0;
17948 position: absolute; 17971 position: absolute;
17949 right: 0%; 17972 right: 0%;
17950 top: -3.125rem;
17951 box-shadow: 0rem 0.1875rem 0.375rem rgba(0, 0, 0, 0.2392156863); 17973 box-shadow: 0rem 0.1875rem 0.375rem rgba(0, 0, 0, 0.2392156863);
17952 border-radius: 1.25rem; 17974 border-radius: 1.25rem;
17953 width: auto; 17975 width: auto;
...@@ -17955,8 +17977,9 @@ p { ...@@ -17955,8 +17977,9 @@ p {
17955 z-index: 98; 17977 z-index: 98;
17956 padding: 0.625rem 1.25rem; 17978 padding: 0.625rem 1.25rem;
17957 background-color: #fff; 17979 background-color: #fff;
17958 transition: 4s ease-in-out; 17980 transition: 0s ease-in-out;
17959 color: #000000; 17981 color: #000000;
17982 bottom: 40px;
17960 } 17983 }
17961 @media only screen and (max-width: 48.875rem) { 17984 @media only screen and (max-width: 48.875rem) {
17962 .badge { 17985 .badge {
...@@ -17999,7 +18022,7 @@ p { ...@@ -17999,7 +18022,7 @@ p {
17999 font-size: 0.875rem; 18022 font-size: 0.875rem;
18000 line-height: 1.125rem; 18023 line-height: 1.125rem;
18001 font-weight: normal; 18024 font-weight: normal;
18002 color: #000000; 18025 color: #000000 !important;
18003 text-align: left; 18026 text-align: left;
18004 word-wrap: break-word; 18027 word-wrap: break-word;
18005 word-wrap: break-word; 18028 word-wrap: break-word;
...@@ -19294,7 +19317,7 @@ ul.sf_date_field .sf-datepicker { ...@@ -19294,7 +19317,7 @@ ul.sf_date_field .sf-datepicker {
19294 border-bottom-left-radius: 10px !important; 19317 border-bottom-left-radius: 10px !important;
19295 } 19318 }
19296 19319
19297 .home-header { 19320 .header {
19298 position: relative; 19321 position: relative;
19299 height: 100%; 19322 height: 100%;
19300 overflow: hidden; 19323 overflow: hidden;
...@@ -19303,11 +19326,16 @@ ul.sf_date_field .sf-datepicker { ...@@ -19303,11 +19326,16 @@ ul.sf_date_field .sf-datepicker {
19303 background-size: cover; 19326 background-size: cover;
19304 background-position: center; 19327 background-position: center;
19305 } 19328 }
19306 .home-header img { 19329 @media only screen and (max-width: 48.875rem) {
19330 .header {
19331 min-height: 260px;
19332 }
19333 }
19334 .header img {
19307 width: 100%; 19335 width: 100%;
19308 height: auto; 19336 height: auto;
19309 } 19337 }
19310 .home-header h1, .home-header .h1 { 19338 .header h1, .header .h1 {
19311 color: #fff; 19339 color: #fff;
19312 margin: auto; 19340 margin: auto;
19313 display: flex; 19341 display: flex;
...@@ -19319,14 +19347,16 @@ ul.sf_date_field .sf-datepicker { ...@@ -19319,14 +19347,16 @@ ul.sf_date_field .sf-datepicker {
19319 font-weight: bold; 19347 font-weight: bold;
19320 text-align: left; 19348 text-align: left;
19321 margin-left: 0px; 19349 margin-left: 0px;
19350 margin-top: 0px;
19322 } 19351 }
19323 @media only screen and (max-width: 48.875rem) { 19352 @media only screen and (max-width: 48.875rem) {
19324 .home-header h1, .home-header .h1 { 19353 .header h1, .header .h1 {
19325 font-size: 1.125rem; 19354 font-size: 1.125rem;
19326 line-height: 1.375rem; 19355 line-height: 1.375rem;
19327 } 19356 }
19328 } 19357 }
19329 .home-header .content-container { 19358
19359 .content-container {
19330 position: absolute; 19360 position: absolute;
19331 bottom: 0rem; 19361 bottom: 0rem;
19332 width: 100%; 19362 width: 100%;
...@@ -19337,7 +19367,12 @@ ul.sf_date_field .sf-datepicker { ...@@ -19337,7 +19367,12 @@ ul.sf_date_field .sf-datepicker {
19337 justify-content: center; 19367 justify-content: center;
19338 background: transparent linear-gradient(180deg, rgba(26, 24, 24, 0) 0%, #000000 100%) 0% 0% no-repeat padding-box; 19368 background: transparent linear-gradient(180deg, rgba(26, 24, 24, 0) 0%, #000000 100%) 0% 0% no-repeat padding-box;
19339 } 19369 }
19340 .home-header .content-container p { 19370 @media only screen and (max-width: 48.875rem) {
19371 .content-container {
19372 background: transparent;
19373 }
19374 }
19375 .content-container p {
19341 color: #fff; 19376 color: #fff;
19342 font-size: 22px; 19377 font-size: 22px;
19343 line-height: 28px; 19378 line-height: 28px;
...@@ -19345,10 +19380,50 @@ ul.sf_date_field .sf-datepicker { ...@@ -19345,10 +19380,50 @@ ul.sf_date_field .sf-datepicker {
19345 max-width: 550px; 19380 max-width: 550px;
19346 margin-bottom: 44px; 19381 margin-bottom: 44px;
19347 } 19382 }
19348 .home-header .content-container .fx-style { 19383 .content-container .fx-style {
19384 max-width: 1067px !important;
19385 margin: auto;
19349 display: flex; 19386 display: flex;
19350 flex-direction: column; 19387 flex-direction: column;
19351 height: 100%; 19388 height: 100%;
19389 justify-content: flex-end;
19390 }
19391
19392 .header.page h1, .header.page .h1 {
19393 font-size: 40px;
19394 line-height: 45px;
19395 }
19396 .header.page p {
19397 color: #fff;
19398 font-size: 18px;
19399 line-height: 24px;
19400 }
19401 .header.page .breadcrumb {
19402 border-radius: 4px;
19403 font-size: 0.75rem;
19404 margin-bottom: 1.25rem;
19405 background-color: #000;
19406 color: #fff;
19407 width: -moz-fit-content;
19408 width: fit-content;
19409 display: block;
19410 position: relative;
19411 padding: 0px 5px;
19412 margin-bottom: 15px;
19413 }
19414 .header.page .breadcrumb a {
19415 text-decoration: none;
19416 text-transform: capitalize;
19417 color: #fff;
19418 }
19419 .header.page .breadcrumb span {
19420 margin: 0rem 0.625rem;
19421 }
19422 .header.page .breadcrumb strong {
19423 font-weight: normal;
19424 }
19425 .header.page .image-side-caption {
19426 background: rgb(0, 0, 0);
19352 } 19427 }
19353 19428
19354 .side-caption:hover, .side-caption:focus-within { 19429 .side-caption:hover, .side-caption:focus-within {
...@@ -19388,7 +19463,7 @@ ul.sf_date_field .sf-datepicker { ...@@ -19388,7 +19463,7 @@ ul.sf_date_field .sf-datepicker {
19388 } 19463 }
19389 19464
19390 .image-side-caption { 19465 .image-side-caption {
19391 background: rgba(0, 0, 0, 0.7); 19466 background: rgb(0, 0, 0);
19392 display: block; 19467 display: block;
19393 color: white; 19468 color: white;
19394 padding: 1rem 2rem; 19469 padding: 1rem 2rem;
...@@ -19410,6 +19485,39 @@ ul.sf_date_field .sf-datepicker { ...@@ -19410,6 +19485,39 @@ ul.sf_date_field .sf-datepicker {
19410 color: white; 19485 color: white;
19411 } 19486 }
19412 19487
19488 .full-black {
19489 background-color: #000;
19490 margin-left: -50%;
19491 margin-right: -50%;
19492 padding-left: calc(50% - 5px);
19493 padding-right: calc(50% - 5px);
19494 padding-top: 31px;
19495 padding-bottom: 20px;
19496 }
19497 .full-black h2, .full-black .h2 {
19498 color: #fff;
19499 font-size: 22px;
19500 line-height: 28px;
19501 margin-bottom: 24px;
19502 }
19503 .full-black a {
19504 color: #EE0000;
19505 font-size: 18px;
19506 line-height: 22px;
19507 }
19508 .full-black a:hover {
19509 color: #669999;
19510 text-decoration: none !important;
19511 }
19512 .full-black p {
19513 color: #fff;
19514 font-size: 16px;
19515 line-height: 21px;
19516 }
19517 .full-black p:has(a) {
19518 margin-bottom: 12px;
19519 }
19520
19413 #main { 19521 #main {
19414 position: relative; 19522 position: relative;
19415 } 19523 }
...@@ -19458,7 +19566,7 @@ ul.sf_date_field .sf-datepicker { ...@@ -19458,7 +19566,7 @@ ul.sf_date_field .sf-datepicker {
19458 } 19566 }
19459 @media screen and (max-width: 59.375rem) { 19567 @media screen and (max-width: 59.375rem) {
19460 .entry-header.page { 19568 .entry-header.page {
19461 min-height: 430px; 19569 min-height: 260px;
19462 } 19570 }
19463 } 19571 }
19464 19572
...@@ -19467,9 +19575,15 @@ ul.sf_date_field .sf-datepicker { ...@@ -19467,9 +19575,15 @@ ul.sf_date_field .sf-datepicker {
19467 width: 100%; 19575 width: 100%;
19468 height: 90px; 19576 height: 90px;
19469 max-width: 1066px; 19577 max-width: 1066px;
19470 position: relative; 19578 position: absolute;
19471 margin: auto; 19579 right: 0px;
19472 right: unset; 19580 }
19581 @media only screen and (max-width: 48.875rem) {
19582 .search-box:hover,
19583 .search-box:focus-within {
19584 width: 95%;
19585 right: 2.5%;
19586 }
19473 } 19587 }
19474 19588
19475 .search-box:focus-within #search-box-content, 19589 .search-box:focus-within #search-box-content,
...@@ -19488,17 +19602,18 @@ ul.sf_date_field .sf-datepicker { ...@@ -19488,17 +19602,18 @@ ul.sf_date_field .sf-datepicker {
19488 } 19602 }
19489 19603
19490 .search-box { 19604 .search-box {
19605 opacity: 0;
19491 background-color: #fff; 19606 background-color: #fff;
19492 border-radius: 1.25rem; 19607 border-radius: 1.25rem;
19493 max-width: 80%; 19608 max-width: 1067px;
19494 margin: auto; 19609 margin: auto;
19495 top: 2.5rem; 19610 position: absolute;
19496 position: relative; 19611 top: 0px;
19497 box-shadow: -2px 7px 7px 0 rgba(0, 0, 0, 0.25); 19612 box-shadow: -2px 7px 7px 0 rgba(0, 0, 0, 0.25);
19498 transition: 0.5s ease-in-out; 19613 transition: 0.5s ease-in-out;
19499 height: 56px; 19614 height: 56px;
19500 width: 56px; 19615 width: 56px;
19501 float: right; 19616 right: 0px;
19502 overflow: hidden; 19617 overflow: hidden;
19503 } 19618 }
19504 @media only screen and (max-width: 48.875rem) { 19619 @media only screen and (max-width: 48.875rem) {
...@@ -19506,7 +19621,7 @@ ul.sf_date_field .sf-datepicker { ...@@ -19506,7 +19621,7 @@ ul.sf_date_field .sf-datepicker {
19506 padding: 0rem 0.625rem; 19621 padding: 0rem 0.625rem;
19507 max-width: 90%; 19622 max-width: 90%;
19508 right: 5%; 19623 right: 5%;
19509 margin-top: 3.5rem; 19624 margin-top: 0.5rem;
19510 } 19625 }
19511 } 19626 }
19512 .search-box .search-button { 19627 .search-box .search-button {
...@@ -19641,27 +19756,28 @@ ul.sf_date_field .sf-datepicker { ...@@ -19641,27 +19756,28 @@ ul.sf_date_field .sf-datepicker {
19641 right: 0.625rem; 19756 right: 0.625rem;
19642 } 19757 }
19643 19758
19644 #page-wrapper { 19759 #full-width-page-wrapper {
19645 margin: 0.625rem 1.875rem 0 1.875rem; 19760 margin: 0.625rem 1.875rem 0 1.875rem;
19646 min-height: 50vh; 19761 min-height: 50vh;
19762 padding-bottom: 0px;
19647 } 19763 }
19648 #page-wrapper .breadcrumb { 19764 #full-width-page-wrapper .breadcrumb {
19649 font-size: 0.75rem; 19765 font-size: 0.75rem;
19650 margin-bottom: 1.25rem; 19766 margin-bottom: 0.25rem;
19651 } 19767 }
19652 #page-wrapper .breadcrumb a { 19768 #full-width-page-wrapper .breadcrumb a {
19653 text-decoration: none; 19769 text-decoration: none;
19654 text-transform: capitalize; 19770 text-transform: capitalize;
19655 } 19771 }
19656 #page-wrapper .breadcrumb span { 19772 #full-width-page-wrapper .breadcrumb span {
19657 margin: 0rem 0.625rem; 19773 margin: 0rem 0.625rem;
19658 } 19774 }
19659 #page-wrapper h1, #page-wrapper .h1 { 19775 #full-width-page-wrapper h1, #full-width-page-wrapper .h1 {
19660 font-size: 2.8125rem; 19776 font-size: 36px;
19661 line-height: 3.25rem; 19777 line-height: 40px;
19662 font-weight: bold; 19778 font-weight: bold;
19663 } 19779 }
19664 #page-wrapper h1 + p, #page-wrapper .h1 + p { 19780 #full-width-page-wrapper .entry-content p:first-of-type {
19665 font-weight: bold; 19781 font-weight: bold;
19666 } 19782 }
19667 19783
...@@ -19815,6 +19931,29 @@ ul.sf_date_field .sf-datepicker { ...@@ -19815,6 +19931,29 @@ ul.sf_date_field .sf-datepicker {
19815 } 19931 }
19816 } 19932 }
19817 19933
19934 .fx-style .header_text {
19935 display: block;
19936 }
19937 @media only screen and (max-width: 48.875rem) {
19938 .fx-style .header_text {
19939 display: none;
19940 }
19941 }
19942
19943 .header_text.mobile {
19944 display: none;
19945 margin-bottom: 24px;
19946 }
19947 .header_text.mobile p {
19948 font-size: 18px;
19949 line-height: 24px;
19950 }
19951 @media only screen and (max-width: 48.875rem) {
19952 .header_text.mobile {
19953 display: block;
19954 }
19955 }
19956
19818 #wrapper-footer { 19957 #wrapper-footer {
19819 background-color: #F0F0F0; 19958 background-color: #F0F0F0;
19820 padding: 2.0625rem 2.5rem; 19959 padding: 2.0625rem 2.5rem;
...@@ -19857,6 +19996,12 @@ ul.sf_date_field .sf-datepicker { ...@@ -19857,6 +19996,12 @@ ul.sf_date_field .sf-datepicker {
19857 display: inline-block; 19996 display: inline-block;
19858 padding-right: 0px; 19997 padding-right: 0px;
19859 } 19998 }
19999 @media only screen and (max-width: 48.875rem) {
20000 #menu-footer-french li,
20001 #menu-footer li {
20002 display: block;
20003 }
20004 }
19860 #menu-footer-french li a, 20005 #menu-footer-french li a,
19861 #menu-footer li a { 20006 #menu-footer li a {
19862 color: #000; 20007 color: #000;
...@@ -19877,6 +20022,12 @@ ul.sf_date_field .sf-datepicker { ...@@ -19877,6 +20022,12 @@ ul.sf_date_field .sf-datepicker {
19877 padding-left: 10px; 20022 padding-left: 10px;
19878 padding-right: 10px; 20023 padding-right: 10px;
19879 } 20024 }
20025 @media only screen and (max-width: 48.875rem) {
20026 #menu-footer-french li::after,
20027 #menu-footer li::after {
20028 content: "";
20029 }
20030 }
19880 #menu-footer-french li:last-of-type::after, 20031 #menu-footer-french li:last-of-type::after,
19881 #menu-footer li:last-of-type::after { 20032 #menu-footer li:last-of-type::after {
19882 display: none; 20033 display: none;
...@@ -19997,7 +20148,6 @@ ul.sf_date_field .sf-datepicker { ...@@ -19997,7 +20148,6 @@ ul.sf_date_field .sf-datepicker {
19997 20148
19998 .call-out-block { 20149 .call-out-block {
19999 background-size: cover; 20150 background-size: cover;
20000 min-height: 18.75rem;
20001 position: relative; 20151 position: relative;
20002 overflow: hidden; 20152 overflow: hidden;
20003 text-align: center; 20153 text-align: center;
...@@ -20007,7 +20157,6 @@ ul.sf_date_field .sf-datepicker { ...@@ -20007,7 +20157,6 @@ ul.sf_date_field .sf-datepicker {
20007 color: #fff; 20157 color: #fff;
20008 margin-left: -50%; 20158 margin-left: -50%;
20009 margin-right: -50%; 20159 margin-right: -50%;
20010 margin-bottom: -1.5625rem;
20011 margin-top: 1.5625rem; 20160 margin-top: 1.5625rem;
20012 padding-left: 50%; 20161 padding-left: 50%;
20013 padding-right: 50%; 20162 padding-right: 50%;
...@@ -20019,9 +20168,13 @@ ul.sf_date_field .sf-datepicker { ...@@ -20019,9 +20168,13 @@ ul.sf_date_field .sf-datepicker {
20019 min-height: 15.625rem; 20168 min-height: 15.625rem;
20020 } 20169 }
20021 } 20170 }
20171 .call-out-block h2, .call-out-block .h2 {
20172 padding-top: 32px;
20173 }
20022 @media screen and (max-width: 48rem) { 20174 @media screen and (max-width: 48rem) {
20023 .call-out-block h2, .call-out-block .h2 { 20175 .call-out-block h2, .call-out-block .h2 {
20024 font-size: 1.5rem; 20176 font-size: 22px;
20177 line-height: 25px;
20025 } 20178 }
20026 } 20179 }
20027 20180
...@@ -20047,11 +20200,11 @@ ul.sf_date_field .sf-datepicker { ...@@ -20047,11 +20200,11 @@ ul.sf_date_field .sf-datepicker {
20047 background-color: #EE0000; 20200 background-color: #EE0000;
20048 color: #fff; 20201 color: #fff;
20049 border: none; 20202 border: none;
20050 font-size: 1.1875rem; 20203 font-size: 14px;
20051 font-weight: 500; 20204 font-weight: 500;
20052 margin: 0.625rem 0 0rem 0; 20205 margin: 24px 0 50px 0;
20053 padding: 0.9375rem 3.75rem; 20206 padding: 8px 46px;
20054 line-height: 1.625rem; 20207 line-height: 17px;
20055 text-decoration: none; 20208 text-decoration: none;
20056 text-transform: uppercase; 20209 text-transform: uppercase;
20057 display: inline-block; 20210 display: inline-block;
...@@ -20061,8 +20214,7 @@ ul.sf_date_field .sf-datepicker { ...@@ -20061,8 +20214,7 @@ ul.sf_date_field .sf-datepicker {
20061 } 20214 }
20062 @media screen and (max-width: 48rem) { 20215 @media screen and (max-width: 48rem) {
20063 .call-out-block a { 20216 .call-out-block a {
20064 font-size: 1rem; 20217 font-size: 16px;
20065 padding: 0.9375rem 1.875rem;
20066 } 20218 }
20067 } 20219 }
20068 20220
...@@ -20072,19 +20224,26 @@ ul.sf_date_field .sf-datepicker { ...@@ -20072,19 +20224,26 @@ ul.sf_date_field .sf-datepicker {
20072 } 20224 }
20073 20225
20074 .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal { 20226 .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal {
20227 display: flex;
20228 padding-top: 2px;
20229 }
20230 @media only screen and (max-width: 48.875rem) {
20231 .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal {
20075 position: absolute; 20232 position: absolute;
20076 right: 20px; 20233 right: 0px;
20077 top: 15px; 20234 top: -12px;
20235 }
20078 } 20236 }
20079 .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal a { 20237 .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal a {
20080 color: #000; 20238 color: #EE0000;
20081 font-weight: bold; 20239 font-weight: bold;
20082 font-size: 22px; 20240 font-size: 16px;
20241 margin-right: 30px;
20242 padding: 0px 10px 6px;
20083 } 20243 }
20084 .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal a:hover { 20244 .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal a:hover {
20085 color: #699 !important; 20245 color: #699 !important;
20086 } 20246 }
20087
20088 .admin-bar .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal { 20247 .admin-bar .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal {
20089 top: 3px; 20248 top: 3px;
20090 } 20249 }
...@@ -20118,7 +20277,7 @@ ul.sf_date_field .sf-datepicker { ...@@ -20118,7 +20277,7 @@ ul.sf_date_field .sf-datepicker {
20118 text-decoration: underline; 20277 text-decoration: underline;
20119 } 20278 }
20120 .promo-area .content { 20279 .promo-area .content {
20121 width: 50%; 20280 width: 66.66%;
20122 display: flex; 20281 display: flex;
20123 flex-direction: column; 20282 flex-direction: column;
20124 justify-content: flex-start; 20283 justify-content: flex-start;
...@@ -20129,9 +20288,14 @@ ul.sf_date_field .sf-datepicker { ...@@ -20129,9 +20288,14 @@ ul.sf_date_field .sf-datepicker {
20129 width: 100%; 20288 width: 100%;
20130 } 20289 }
20131 } 20290 }
20291 .promo-area .content p {
20292 font-weight: normal !important;
20293 font-size: 16px;
20294 line-height: 20px;
20295 }
20132 .promo-area .image { 20296 .promo-area .image {
20133 background-size: cover; 20297 background-size: cover;
20134 width: 50%; 20298 width: 33.33%;
20135 overflow: hidden; 20299 overflow: hidden;
20136 border-radius: 0rem 0rem 1.25rem 1.25rem; 20300 border-radius: 0rem 0rem 1.25rem 1.25rem;
20137 position: relative; 20301 position: relative;
...@@ -20223,10 +20387,9 @@ ul.sf_date_field .sf-datepicker { ...@@ -20223,10 +20387,9 @@ ul.sf_date_field .sf-datepicker {
20223 20387
20224 .carousel:not(.is-admin) { 20388 .carousel:not(.is-admin) {
20225 background-color: transparent !important; 20389 background-color: transparent !important;
20226 left: -1.25rem; 20390 left: -5%;
20227 width: 100vw; 20391 width: 110%;
20228 margin-top: 1.875rem; 20392 margin-top: 24px;
20229 margin-bottom: 1.875rem;
20230 padding: 0rem 3.125rem; 20393 padding: 0rem 3.125rem;
20231 } 20394 }
20232 @media only screen and (max-width: 48.875rem) { 20395 @media only screen and (max-width: 48.875rem) {
...@@ -20242,13 +20405,12 @@ ul.sf_date_field .sf-datepicker { ...@@ -20242,13 +20405,12 @@ ul.sf_date_field .sf-datepicker {
20242 display: flex; 20405 display: flex;
20243 justify-content: center; 20406 justify-content: center;
20244 align-items: center; 20407 align-items: center;
20245 max-width: 75rem;
20246 margin: 0 auto; 20408 margin: 0 auto;
20247 overflow: hidden; 20409 overflow: hidden;
20248 } 20410 }
20249 20411
20250 .carousel-content { 20412 .carousel-content {
20251 padding: 0rem 3.125rem; 20413 height: 260px;
20252 } 20414 }
20253 @media only screen and (max-width: 48.875rem) { 20415 @media only screen and (max-width: 48.875rem) {
20254 .carousel-content { 20416 .carousel-content {
...@@ -20257,7 +20419,10 @@ ul.sf_date_field .sf-datepicker { ...@@ -20257,7 +20419,10 @@ ul.sf_date_field .sf-datepicker {
20257 } 20419 }
20258 20420
20259 .promo-image { 20421 .promo-image {
20260 height: 178px; 20422 width: 340px;
20423 height: 186px;
20424 overflow: hidden;
20425 padding: 0px 4px;
20261 } 20426 }
20262 @media only screen and (max-width: 48.875rem) { 20427 @media only screen and (max-width: 48.875rem) {
20263 .promo-image { 20428 .promo-image {
...@@ -20280,8 +20445,8 @@ ul.sf_date_field .sf-datepicker { ...@@ -20280,8 +20445,8 @@ ul.sf_date_field .sf-datepicker {
20280 text-align: left; 20445 text-align: left;
20281 } 20446 }
20282 .promo-carousel .promo-text { 20447 .promo-carousel .promo-text {
20283 margin-left: 1.25rem; 20448 margin-left: 0px;
20284 margin-left: 1.25rem; 20449 margin-top: 24px;
20285 text-align: left; 20450 text-align: left;
20286 font-size: 1rem; 20451 font-size: 1rem;
20287 line-height: 1.5rem; 20452 line-height: 1.5rem;
...@@ -20298,7 +20463,7 @@ ul.sf_date_field .sf-datepicker { ...@@ -20298,7 +20463,7 @@ ul.sf_date_field .sf-datepicker {
20298 } 20463 }
20299 .promo-carousel .understrap-read-more-link { 20464 .promo-carousel .understrap-read-more-link {
20300 font-weight: bold; 20465 font-weight: bold;
20301 text-transform: uppercase; 20466 text-transform: capitalize;
20302 text-decoration: none; 20467 text-decoration: none;
20303 } 20468 }
20304 .promo-carousel .understrap-read-more-link:hover { 20469 .promo-carousel .understrap-read-more-link:hover {
...@@ -20319,8 +20484,10 @@ ul.sf_date_field .sf-datepicker { ...@@ -20319,8 +20484,10 @@ ul.sf_date_field .sf-datepicker {
20319 width: 2.1875rem !important; 20484 width: 2.1875rem !important;
20320 height: 2.1875rem !important; 20485 height: 2.1875rem !important;
20321 border: 0rem solid #EE0000; 20486 border: 0rem solid #EE0000;
20322 border-radius: 0rem 1.25rem 1.25rem 0rem; 20487 border-radius: 1.25rem;
20323 display: none; 20488 display: none;
20489 left: -15px !important;
20490 top: calc(50% - 1rem) !important;
20324 } 20491 }
20325 .swiper-button-prev:after { 20492 .swiper-button-prev:after {
20326 content: "" !important; 20493 content: "" !important;
...@@ -20332,16 +20499,17 @@ ul.sf_date_field .sf-datepicker { ...@@ -20332,16 +20499,17 @@ ul.sf_date_field .sf-datepicker {
20332 display: inline-block; 20499 display: inline-block;
20333 position: absolute; 20500 position: absolute;
20334 top: 0.5rem; 20501 top: 0.5rem;
20335 left: 0.8125rem; 20502 left: 11px;
20336 } 20503 }
20337 20504
20338 .swiper-button-next { 20505 .swiper-button-next {
20339 background-color: #EE0000; 20506 background-color: #EE0000;
20340 right: 0rem !important; 20507 right: 0rem !important;
20508 top: calc(50% - 1rem) !important;
20341 width: 2.1875rem !important; 20509 width: 2.1875rem !important;
20342 height: 2.1875rem !important; 20510 height: 2.1875rem !important;
20343 border: 0rem solid #EE0000; 20511 border: 0rem solid #EE0000;
20344 border-radius: 1.25rem 0rem 0rem 1.25rem; 20512 border-radius: 1.25rem;
20345 display: none; 20513 display: none;
20346 } 20514 }
20347 @media only screen and (max-width: 25rem) { 20515 @media only screen and (max-width: 25rem) {
...@@ -20385,7 +20553,7 @@ ul.sf_date_field .sf-datepicker { ...@@ -20385,7 +20553,7 @@ ul.sf_date_field .sf-datepicker {
20385 } 20553 }
20386 20554
20387 #pojo-a11y-toolbar { 20555 #pojo-a11y-toolbar {
20388 position: absolute; 20556 position: relative;
20389 top: 1.25rem; 20557 top: 1.25rem;
20390 } 20558 }
20391 @media screen and (max-width: 62.5rem) { 20559 @media screen and (max-width: 62.5rem) {
...@@ -20400,19 +20568,18 @@ ul.sf_date_field .sf-datepicker { ...@@ -20400,19 +20568,18 @@ ul.sf_date_field .sf-datepicker {
20400 20568
20401 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle { 20569 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle {
20402 z-index: 9999 !important; 20570 z-index: 9999 !important;
20403 right: 115px !important;
20404 } 20571 }
20405 20572
20406 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle a { 20573 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle a {
20407 width: 40px; 20574 width: 20px;
20408 box-shadow: none !important; 20575 box-shadow: none !important;
20409 position: absolute; 20576 position: absolute;
20577 padding-left: 5px !important;
20410 } 20578 }
20411 20579
20412 .pojo-a11y-toolbar-overlay { 20580 .pojo-a11y-toolbar-overlay {
20413 position: absolute; 20581 position: relative;
20414 top: 3.125rem; 20582 top: 3.125rem;
20415 right: 0rem;
20416 display: none; 20583 display: none;
20417 border-radius: 0rem 0rem 0.625rem 0.625rem; 20584 border-radius: 0rem 0rem 0.625rem 0.625rem;
20418 } 20585 }
...@@ -20422,23 +20589,24 @@ ul.sf_date_field .sf-datepicker { ...@@ -20422,23 +20589,24 @@ ul.sf_date_field .sf-datepicker {
20422 20589
20423 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle svg { 20590 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle svg {
20424 max-width: inherit; 20591 max-width: inherit;
20425 border: 0.125rem #000 solid; 20592 border: 1px #000 solid;
20426 border-radius: 50%; 20593 border-radius: 50%;
20427 padding: 0.1875rem; 20594 padding: 0.1875rem;
20428 height: 1.75rem; 20595 height: 20px;
20429 width: 1.75rem; 20596 width: 20px;
20430 } 20597 }
20431 20598
20432 .pojo-a11y-toolbar-open { 20599 .pojo-a11y-toolbar-open {
20433 z-index: 99999; 20600 z-index: 99999;
20434 } 20601 }
20435 .pojo-a11y-toolbar-open .pojo-a11y-toolbar-toggle svg { 20602 .pojo-a11y-toolbar-open .pojo-a11y-toolbar-toggle svg {
20436 border: 0.125rem #669999 solid !important; 20603 border: 1px #669999 solid !important;
20437 color: #669999; 20604 color: #669999;
20438 } 20605 }
20439 .pojo-a11y-toolbar-open .pojo-a11y-toolbar-toggle a { 20606 .pojo-a11y-toolbar-open .pojo-a11y-toolbar-toggle a {
20440 color: #669999; 20607 color: #669999;
20441 text-decoration: none; 20608 text-decoration: none;
20609 background-color: transparent !important;
20442 } 20610 }
20443 .pojo-a11y-toolbar-open .pojo-a11y-toolbar-overlay { 20611 .pojo-a11y-toolbar-open .pojo-a11y-toolbar-overlay {
20444 position: absolute; 20612 position: absolute;
...@@ -20446,15 +20614,16 @@ ul.sf_date_field .sf-datepicker { ...@@ -20446,15 +20614,16 @@ ul.sf_date_field .sf-datepicker {
20446 right: 0rem; 20614 right: 0rem;
20447 display: block; 20615 display: block;
20448 } 20616 }
20617 @media screen and (max-width: 62.5rem) {
20618 .pojo-a11y-toolbar-open .pojo-a11y-toolbar-overlay {
20619 top: 2.125rem;
20620 }
20621 }
20449 20622
20450 #gt_float_wrapper .gt_float_switcher { 20623 #gt_float_wrapper .gt_float_switcher {
20451 background-color: transparent !important; 20624 background-color: transparent !important;
20452 } 20625 }
20453 20626
20454 [lang=zh-CN] #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle a {
20455 right: -15rem !important;
20456 }
20457
20458 .pojo-a11y-toolbar-text { 20627 .pojo-a11y-toolbar-text {
20459 font-size: 1rem; 20628 font-size: 1rem;
20460 } 20629 }
...@@ -20471,13 +20640,44 @@ ul.sf_date_field .sf-datepicker { ...@@ -20471,13 +20640,44 @@ ul.sf_date_field .sf-datepicker {
20471 color: #669999 !important; 20640 color: #669999 !important;
20472 } 20641 }
20473 .pojo-a11y-toolbar-toggle-link:hover svg { 20642 .pojo-a11y-toolbar-toggle-link:hover svg {
20474 border: 0.125rem #669999 solid !important; 20643 border: 1px #669999 solid !important;
20475 } 20644 }
20476 20645
20477 #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a, #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay p.pojo-a11y-toolbar-title { 20646 #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a, #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay p.pojo-a11y-toolbar-title {
20478 text-decoration: none; 20647 text-decoration: none;
20479 } 20648 }
20480 20649
20650 .pojo-a11y-toolbar-inner::before {
20651 content: "";
20652 display: block;
20653 width: 90%;
20654 height: 1px;
20655 background-color: #ccc;
20656 margin: auto;
20657 }
20658
20659 #pojo-a11y-toolbar.pojo-a11y-toolbar-right .pojo-a11y-toolbar-toggle {
20660 right: 40px !important;
20661 }
20662
20663 .pojo-a11y-toolbar-open .pojo-a11y-toolbar-link.pojo-a11y-toolbar-toggle-link::after {
20664 content: "";
20665 display: block;
20666 position: relative;
20667 margin-top: 6px;
20668 margin-bottom: 10px;
20669 margin-left: 4px;
20670 width: 13px;
20671 height: 7px;
20672 background-repeat: no-repeat;
20673 background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12.742" height="7.726" viewBox="0 0 12.742 7.726"><path id="Path_1502" data-name="Path 1502" d="M6.383,4.709c.442-.447.875-.89,1.313-1.328Q9.274,1.8,10.855.231a.708.708,0,0,1,1.047,0c.2.206.405.407.608.61a.694.694,0,0,1,0,1.038L9.667,4.721,6.913,7.48a.768.768,0,0,1-.515.246.734.734,0,0,1-.567-.245Q4.769,6.415,3.706,5.349L.812,2.454c-.2-.2-.395-.393-.591-.591A.69.69,0,0,1,.228.844l.6-.6a.708.708,0,0,1,1.062,0L4.456,2.792,6.311,4.64Z"/></svg>');
20674 }
20675 @media screen and (max-width: 62.5rem) {
20676 .pojo-a11y-toolbar-open .pojo-a11y-toolbar-link.pojo-a11y-toolbar-toggle-link::after {
20677 display: none;
20678 }
20679 }
20680
20481 .pojo-a11y-resize-font-130 #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row { 20681 .pojo-a11y-resize-font-130 #mega-menu-wrap-primary #mega-menu-primary li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-row {
20482 height: 80vh; 20682 height: 80vh;
20483 overflow: scroll; 20683 overflow: scroll;
...@@ -20947,7 +21147,7 @@ ul.sf_date_field .sf-datepicker { ...@@ -20947,7 +21147,7 @@ ul.sf_date_field .sf-datepicker {
20947 flex-direction: row-reverse; 21147 flex-direction: row-reverse;
20948 flex-wrap: wrap; 21148 flex-wrap: wrap;
20949 justify-content: center; 21149 justify-content: center;
20950 margin: 2.25rem 0; 21150 margin: 24px 0;
20951 } 21151 }
20952 .news-and-stories-block .post-list-left-col { 21152 .news-and-stories-block .post-list-left-col {
20953 flex-basis: 50%; 21153 flex-basis: 50%;
...@@ -20968,7 +21168,7 @@ ul.sf_date_field .sf-datepicker { ...@@ -20968,7 +21168,7 @@ ul.sf_date_field .sf-datepicker {
20968 list-style: none; 21168 list-style: none;
20969 padding: 0; 21169 padding: 0;
20970 margin: 0; 21170 margin: 0;
20971 gap: 24px; 21171 gap: 12px;
20972 } 21172 }
20973 .news-and-stories-block ul .article-card { 21173 .news-and-stories-block ul .article-card {
20974 min-height: 117px; 21174 min-height: 117px;
...@@ -20979,13 +21179,28 @@ ul.sf_date_field .sf-datepicker { ...@@ -20979,13 +21179,28 @@ ul.sf_date_field .sf-datepicker {
20979 text-decoration: none; 21179 text-decoration: none;
20980 } 21180 }
20981 .news-and-stories-block ul .article-card.lg { 21181 .news-and-stories-block ul .article-card.lg {
20982 min-height: 30.438rem; 21182 min-height: 28rem;
20983 max-height: 30.438rem; 21183 max-height: 28rem;
21184 }
21185 .news-and-stories-block ul .article-card.lg .image-large {
21186 position: relative;
21187 }
21188 .news-and-stories-block ul .article-card.lg .overlay {
21189 position: absolute;
21190 top: 0;
21191 bottom: 0;
21192 left: 0;
21193 right: 0;
21194 height: 100%;
21195 width: 100%;
21196 transition: 0.5s ease;
21197 background-color: transparent;
20984 } 21198 }
20985 .news-and-stories-block ul .article-card.lg .scale-wrapper { 21199 .news-and-stories-block ul .article-card.lg .scale-wrapper {
20986 min-height: 291px; 21200 min-height: 291px;
20987 max-height: 291px; 21201 max-height: 291px;
20988 overflow: hidden; 21202 overflow: hidden;
21203 position: relative;
20989 } 21204 }
20990 .news-and-stories-block ul .article-card.lg img { 21205 .news-and-stories-block ul .article-card.lg img {
20991 height: 100%; 21206 height: 100%;
...@@ -20996,6 +21211,17 @@ ul.sf_date_field .sf-datepicker { ...@@ -20996,6 +21211,17 @@ ul.sf_date_field .sf-datepicker {
20996 .news-and-stories-block ul .article-card.lg a { 21211 .news-and-stories-block ul .article-card.lg a {
20997 gap: 0; 21212 gap: 0;
20998 } 21213 }
21214 .news-and-stories-block ul .article-card.sm .overlay {
21215 position: absolute;
21216 top: 0;
21217 bottom: 0;
21218 left: 0;
21219 right: 0;
21220 height: 100%;
21221 width: 100%;
21222 transition: 0.5s ease;
21223 background-color: transparent;
21224 }
20999 .news-and-stories-block ul .article-card.sm .content { 21225 .news-and-stories-block ul .article-card.sm .content {
21000 padding-bottom: 0; 21226 padding-bottom: 0;
21001 line-height: 1.125rem; 21227 line-height: 1.125rem;
...@@ -21003,18 +21229,16 @@ ul.sf_date_field .sf-datepicker { ...@@ -21003,18 +21229,16 @@ ul.sf_date_field .sf-datepicker {
21003 .news-and-stories-block ul .article-card img { 21229 .news-and-stories-block ul .article-card img {
21004 transition: transform 0.3s; 21230 transition: transform 0.3s;
21005 } 21231 }
21232 .news-and-stories-block ul .article-card:hover .overlay {
21233 background: rgba(0, 0, 0, 0.4);
21234 }
21006 .news-and-stories-block ul .article-card:hover a { 21235 .news-and-stories-block ul .article-card:hover a {
21007 color: #699; 21236 color: #699;
21008 text-decoration: underline; 21237 text-decoration: underline;
21009 } 21238 }
21010 .news-and-stories-block ul .article-card:hover img {
21011 transform: scale(1.05);
21012 opacity: 0.8;
21013 }
21014
21015 .article-card { 21239 .article-card {
21016 max-width: 31.875rem; 21240 max-width: 31rem;
21017 min-width: 31.875rem; 21241 min-width: 31rem;
21018 min-height: 8.438rem; 21242 min-height: 8.438rem;
21019 } 21243 }
21020 .article-card a { 21244 .article-card a {
...@@ -21100,6 +21324,7 @@ ul.sf_date_field .sf-datepicker { ...@@ -21100,6 +21324,7 @@ ul.sf_date_field .sf-datepicker {
21100 -o-object-fit: cover; 21324 -o-object-fit: cover;
21101 object-fit: cover; 21325 object-fit: cover;
21102 overflow: hidden; 21326 overflow: hidden;
21327 position: relative;
21103 } 21328 }
21104 .article-card .image img { 21329 .article-card .image img {
21105 -o-object-fit: cover; 21330 -o-object-fit: cover;
...@@ -21128,6 +21353,21 @@ ul.sf_date_field .sf-datepicker { ...@@ -21128,6 +21353,21 @@ ul.sf_date_field .sf-datepicker {
21128 display: none; 21353 display: none;
21129 } 21354 }
21130 21355
21356 .load-more-link-out {
21357 border-radius: 40px;
21358 padding: 8px 88px;
21359 background: #EE0000;
21360 text-transform: uppercase;
21361 font-size: 14px;
21362 color: #fff;
21363 font-weight: bold;
21364 }
21365
21366 .load-more-link-out:hover {
21367 background: #669999;
21368 color: #fff;
21369 }
21370
21131 .mobile-article-list { 21371 .mobile-article-list {
21132 display: none; 21372 display: none;
21133 } 21373 }
......
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
...@@ -34,13 +34,13 @@ if ( is_front_page() ) { ...@@ -34,13 +34,13 @@ if ( is_front_page() ) {
34 <article <?php post_class(); ?> id="post-<?php the_ID(); ?>"> 34 <article <?php post_class(); ?> id="post-<?php the_ID(); ?>">
35 35
36 <?php if ( has_post_thumbnail() ) { ?> 36 <?php if ( has_post_thumbnail() ) { ?>
37 <div class='cap-wrap home-header' style=" background-image: url('<?php echo $url;?> ')"> 37 <div class='cap-wrap header' style=" background-image: url('<?php echo $url;?> ')">
38 38
39 <div class="content-container"> 39 <div class="content-container">
40 <div class="container" style="height: 100%;"> 40 <div class="container" style="height: 100%;">
41 <div class="col-md-12 fx-style"> 41 <div class="col-md-12 fx-style">
42 <div class="search-box"><?php the_field('search_box_content'); ?><div class="search-button">Search</div></div> 42 <div class="search-box"><div id="search-box-content"><?php the_field('page_search_block', 'option'); ?></div> <div class="search-button">Search</div></div>
43 <?php the_field('header_text'); ?> 43 <div class="header_text"> <?php the_field('header_text'); ?> </div>
44 </div> 44 </div>
45 </div> 45 </div>
46 </div> 46 </div>
...@@ -66,7 +66,7 @@ if ( is_front_page() ) { ...@@ -66,7 +66,7 @@ if ( is_front_page() ) {
66 <div class="col-md-12 content-area" id="primary"> 66 <div class="col-md-12 content-area" id="primary">
67 67
68 <main class="site-main" id="main" role="main"> 68 <main class="site-main" id="main" role="main">
69 69 <div class="header_text mobile"> <?php the_field('header_text'); ?> </div>
70 <?php 70 <?php
71 while ( have_posts() ) { 71 while ( have_posts() ) {
72 the_post(); 72 the_post();
......
...@@ -27,6 +27,7 @@ $container = get_theme_mod( 'understrap_container_type' ); ...@@ -27,6 +27,7 @@ $container = get_theme_mod( 'understrap_container_type' );
27 <a rel="home" class="site-title" href="<?php echo esc_url( home_url( '/' ) ); ?>" itemprop="url"> 27 <a rel="home" class="site-title" href="<?php echo esc_url( home_url( '/' ) ); ?>" itemprop="url">
28 <div class="">MSF CLIMATE HUB</div> 28 <div class="">MSF CLIMATE HUB</div>
29 </a> 29 </a>
30 <?= do_shortcode('[wpml_language_selector_widget link_current=0]') ?>
30 </div> 31 </div>
31 <!-- <button 32 <!-- <button
32 class="navbar-toggler" 33 class="navbar-toggler"
...@@ -57,5 +58,5 @@ $container = get_theme_mod( 'understrap_container_type' ); ...@@ -57,5 +58,5 @@ $container = get_theme_mod( 'understrap_container_type' );
57 ?> 58 ?>
58 59
59 </div><!-- .container(-fluid) --> 60 </div><!-- .container(-fluid) -->
60 <?= do_shortcode('[wpml_language_selector_widget link_current=0]') ?> 61
61 </nav><!-- #main-nav --> 62 </nav><!-- #main-nav -->
......
...@@ -20663,97 +20663,28 @@ ...@@ -20663,97 +20663,28 @@
20663 $$1.fn.DataTable[prop] = val; 20663 $$1.fn.DataTable[prop] = val;
20664 }); 20664 });
20665 20665
20666 var addstuff = '<div class="list-wrapper2 list-wrapper"><button type="button" class="back-one-level"><span>Back</span></button><div class="sub-menu-wrapper"></div></div><div class="list-wrapper3 list-wrapper"><button type="button" class="back-one-level"><span>Back</span></button><div class="sub-menu-wrapper"></div></div>';
20667 const pageHeader = document.querySelector("#main-nav");
20668 const toggleMenu = pageHeader.querySelector(".mega-toggle-block");
20669 pageHeader.querySelector(".mega-menu-toggle.mega-menu-open");
20670 const menuWrapper = pageHeader.querySelector("#mega-menu-primary");
20671 menuWrapper.innerHTML = menuWrapper.innerHTML + addstuff;
20672 const level1Links = pageHeader.querySelectorAll("li.mega-menu-item-has-children > a.mega-menu-link");
20673 const listWrapper2 = pageHeader.querySelector(".list-wrapper2");
20674 const listWrapper3 = pageHeader.querySelector(".list-wrapper3");
20675 const subMenuWrapper2 = listWrapper2.querySelector(".sub-menu-wrapper");
20676 const subMenuWrapper3 = listWrapper3.querySelector(".sub-menu-wrapper");
20677 const backOneLevelBtns = pageHeader.querySelectorAll(".back-one-level");
20678 const isVisibleClass = "is-visible";
20679 const isActiveClass = "is-active";
20680 const isBtVisible = "is-bt-active";
20681 for (const level1Link of level1Links) {
20682 level1Link.addEventListener("click", function (e) {
20683 const siblingList = level1Link.nextElementSibling;
20684 console.log('clicked level1Links');
20685 if (siblingList) {
20686 e.preventDefault();
20687 this.classList.add(isActiveClass);
20688 const cloneSiblingList = siblingList.cloneNode(true);
20689 subMenuWrapper2.innerHTML = "";
20690 subMenuWrapper2.append(cloneSiblingList);
20691 listWrapper2.classList.add(isVisibleClass);
20692 setTimeout(() => {
20693 backOneLevelBtns[0].classList.add(isBtVisible);
20694 }, 1000);
20695 }
20696 });
20697 }
20698 listWrapper2.addEventListener("click", function (e) {
20699 const target = e.target;
20700 const parent = target.closest("a");
20701 if (target.tagName.toLowerCase() === "a" && target.nextElementSibling) {
20702 const siblingList = target.nextElementSibling;
20703 e.preventDefault();
20704 target.classList.add(isActiveClass);
20705 const cloneSiblingList = siblingList.cloneNode(true);
20706 subMenuWrapper3.innerHTML = "";
20707 subMenuWrapper3.append(cloneSiblingList);
20708 listWrapper3.classList.add(isVisibleClass);
20709 setTimeout(() => {
20710 backOneLevelBtns[1].classList.add(isBtVisible);
20711 }, 1000);
20712 } else if (parent.tagName.toLowerCase() === "a" && parent.nextElementSibling) {
20713 const siblingList = parent.nextElementSibling;
20714 e.preventDefault();
20715 parent.classList.add(isActiveClass);
20716 const cloneSiblingList = siblingList.cloneNode(true);
20717 subMenuWrapper3.innerHTML = "";
20718 subMenuWrapper3.append(cloneSiblingList);
20719 listWrapper3.classList.add(isVisibleClass);
20720 setTimeout(() => {
20721 backOneLevelBtns[1].classList.add(isBtVisible);
20722 }, 1000);
20723 }
20724 });
20725 for (const backOneLevelBtn of backOneLevelBtns) {
20726 backOneLevelBtn.addEventListener("click", function () {
20727 console.log(this);
20728 this.style.display = "";
20729 const parent = this.closest(".list-wrapper");
20730 parent.classList.remove(isVisibleClass);
20731 this.classList.remove(isBtVisible);
20732 setTimeout(() => {
20733 parent.scrollTo({
20734 top: 0,
20735 behavior: 'smooth'
20736 });
20737 }, 500);
20738 });
20739 toggleMenu.addEventListener("click", function () {
20740 setTimeout(() => {
20741 console.log('clicked toggleMenu');
20742 listWrapper2.scrollTo({
20743 top: 0,
20744 behavior: 'smooth'
20745 });
20746 listWrapper3.scrollTo({
20747 top: 0,
20748 behavior: 'smooth'
20749 });
20750 }, 500);
20751 });
20752 }
20753
20754 // Search Filter 20666 // Search Filter
20755 var Search = function ($) { 20667 var Search = function ($) {
20756 function init() { 20668 function init() {
20669 $('.search-box').css('margin-right', $('#main-nav .container').css('margin-right'));
20670 $('.search-box').css('opacity', '1');
20671 $('.badge').css('margin-right', $('#main-nav .container').css('margin-right'));
20672 $('#pojo-a11y-toolbar').css('margin-right', $('#main-nav .container').css('margin-right'));
20673 $('.badge').css('opacity', '1');
20674 setTimeout(() => {
20675 $('.badge').css('transition', '4s ease-in-out');
20676 }, "100");
20677 $(window).on('resize', function () {
20678 $('.search-box').css('transition', '0s ease-in-out');
20679 $('.search-box').css('margin-right', $('#main-nav .container').css('margin-right'));
20680 $('#pojo-a11y-toolbar').css('margin-right', $('#main-nav .container').css('margin-right'));
20681 $('.badge').css('transition', '0s ease-in-out');
20682 $('.badge').css('margin-right', $('#main-nav .container').css('margin-right'));
20683 setTimeout(() => {
20684 $('.badge').css('transition', '4s ease-in-out');
20685 $('.search-box').css('transition', 'all 0.5s ease-in-out 0s');
20686 }, "100");
20687 });
20757 $(".searchandfilter ul li:contains('hidden')").hide(); 20688 $(".searchandfilter ul li:contains('hidden')").hide();
20758 $('<li class="sf-field-reset"><input type="submit" class="search-filter-reset-custom" value="CLEAR ALL" ></li>').appendTo(jQuery('#advance-search-modal .searchandfilter ul:first-child ')); 20689 $('<li class="sf-field-reset"><input type="submit" class="search-filter-reset-custom" value="CLEAR ALL" ></li>').appendTo(jQuery('#advance-search-modal .searchandfilter ul:first-child '));
20759 $(document).on("click", ".search-filter-reset-custom", function (e) { 20690 $(document).on("click", ".search-filter-reset-custom", function (e) {
...@@ -26198,7 +26129,7 @@ ...@@ -26198,7 +26129,7 @@
26198 var PerView = 3; 26129 var PerView = 3;
26199 var offset = 0; 26130 var offset = 0;
26200 var space = 20; 26131 var space = 20;
26201 var SlidesPerGroup = 1; 26132 var SlidesPerGroup = 3;
26202 var _id = jQuery(this).parent().attr('id'); 26133 var _id = jQuery(this).parent().attr('id');
26203 if ($(window).width() < 600) { 26134 if ($(window).width() < 600) {
26204 offset = 0; 26135 offset = 0;
...@@ -26214,7 +26145,7 @@ ...@@ -26214,7 +26145,7 @@
26214 slidesOffsetBefore: offset, 26145 slidesOffsetBefore: offset,
26215 spaceBetween: space, 26146 spaceBetween: space,
26216 slidesPerGroup: SlidesPerGroup, 26147 slidesPerGroup: SlidesPerGroup,
26217 centeredSlides: true, 26148 // centeredSlides: true,
26218 loop: false, 26149 loop: false,
26219 lazy: true, 26150 lazy: true,
26220 pagination: { 26151 pagination: {
...@@ -26237,10 +26168,12 @@ ...@@ -26237,10 +26168,12 @@
26237 }; 26168 };
26238 new Swiper(this, swiper_params); 26169 new Swiper(this, swiper_params);
26239 }); 26170 });
26240 $('.carousel ').css('margin-left', "-" + $('#content').css('margin-left')); 26171 // $('.carousel ').css('margin-left',"-"+$('#content').css('margin-left'));
26241 $(window).on('resize', function () { 26172
26242 $('.carousel ').css('margin-left', "-" + $('#content').css('margin-left')); 26173 // $(window).on('resize', function(){
26243 }); 26174 // $('.carousel ').css('margin-left',"-"+$('#content').css('margin-left'));
26175
26176 // });
26244 }); 26177 });
26245 26178
26246 var mobile_article_list = []; 26179 var mobile_article_list = [];
...@@ -26249,7 +26182,7 @@ ...@@ -26249,7 +26182,7 @@
26249 if (size == 2) { 26182 if (size == 2) {
26250 li += "<li class='article-card lg'><a href='" + post_obj['href'] + "'>"; 26183 li += "<li class='article-card lg'><a href='" + post_obj['href'] + "'>";
26251 if (post_obj['img_src']) { 26184 if (post_obj['img_src']) {
26252 li += "<div class='scale-wrapper'><img src='" + post_obj['img_src'] + "' /></div>"; 26185 li += "<div class='image-large'><div class='scale-wrapper'><img src='" + post_obj['img_src'] + "' /></div><div class='overlay'></div></div>";
26253 } 26186 }
26254 if (post_obj['title'].length > 100) { 26187 if (post_obj['title'].length > 100) {
26255 li += "<div class='content reduce'><p>" + post_obj['title'] + "</p><span class='anchor-dots'></span></div>"; 26188 li += "<div class='content reduce'><p>" + post_obj['title'] + "</p><span class='anchor-dots'></span></div>";
...@@ -26263,7 +26196,7 @@ ...@@ -26263,7 +26196,7 @@
26263 } else { 26196 } else {
26264 li += "<li class='article-card sm'><a href='" + post_obj['href'] + "'>"; 26197 li += "<li class='article-card sm'><a href='" + post_obj['href'] + "'>";
26265 if (post_obj['img_src']) { 26198 if (post_obj['img_src']) {
26266 li += "<div class='image'><div class='scale-wrapper'><img src='" + post_obj['img_src'] + "' /></div></div>"; 26199 li += "<div class='image'><div class='scale-wrapper'><img src='" + post_obj['img_src'] + "' /></div><div class='overlay'></div></div>";
26267 } 26200 }
26268 if (post_obj['title'].length > 100) { 26201 if (post_obj['title'].length > 100) {
26269 li += "<div class='content reduce'><p>" + post_obj['title'] + "</p>"; 26202 li += "<div class='content reduce'><p>" + post_obj['title'] + "</p>";
...@@ -26409,7 +26342,7 @@ ...@@ -26409,7 +26342,7 @@
26409 if ($(that).parents('.related').find('.related-block.hidden[data-related-segment="' + (segment + 1) + '"]').length == 0) { 26342 if ($(that).parents('.related').find('.related-block.hidden[data-related-segment="' + (segment + 1) + '"]').length == 0) {
26410 $(that).remove(); 26343 $(that).remove();
26411 } 26344 }
26412 }, 500); 26345 }, 100);
26413 }); 26346 });
26414 $('.news-and-stories-block').each(function () { 26347 $('.news-and-stories-block').each(function () {
26415 var no_load = $(this).data('no-load'), 26348 var no_load = $(this).data('no-load'),
......
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
7 7
8 // Exit if accessed directly. 8 // Exit if accessed directly.
9 defined( 'ABSPATH' ) || exit; 9 defined( 'ABSPATH' ) || exit;
10 $badge = get_field('badge'); 10
11 11
12 ?> 12 ?>
13 13
...@@ -20,11 +20,7 @@ $badge = get_field('badge'); ...@@ -20,11 +20,7 @@ $badge = get_field('badge');
20 20
21 21
22 <div class="entry-content"> 22 <div class="entry-content">
23 <?php if($badge){
24 $badge_content = get_field('badge_content');
25 echo "<div class='badge'><span>".$badge_content['badge_label']."</span><div class='badge_content'><p>".$badge_content['badge_text']."</p></div></div>";
26 23
27 }?>
28 24
29 <?php 25 <?php
30 the_content(); 26 the_content();
......
...@@ -21,6 +21,7 @@ $post_thumbnail_id = get_post_thumbnail_id($post->ID); ...@@ -21,6 +21,7 @@ $post_thumbnail_id = get_post_thumbnail_id($post->ID);
21 $thumbnail_image = get_posts(array('p' => $post_thumbnail_id, 'post_type' => 'attachment')); 21 $thumbnail_image = get_posts(array('p' => $post_thumbnail_id, 'post_type' => 'attachment'));
22 $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID), 'full' ); 22 $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID), 'full' );
23 $subhead = get_field('subhead'); 23 $subhead = get_field('subhead');
24 //$badge = get_field('badge');
24 25
25 if ($thumbnail_image && isset($thumbnail_image[0])) { 26 if ($thumbnail_image && isset($thumbnail_image[0])) {
26 $img_description = $thumbnail_image[0]->post_content; 27 $img_description = $thumbnail_image[0]->post_content;
...@@ -36,11 +37,25 @@ if ($thumbnail_image && isset($thumbnail_image[0])) { ...@@ -36,11 +37,25 @@ if ($thumbnail_image && isset($thumbnail_image[0])) {
36 37
37 ?> 38 ?>
38 <?php if ( has_post_thumbnail() ) { ?> 39 <?php if ( has_post_thumbnail() ) { ?>
39 <header class="entry-header page" style=" background-image: url('<?php echo $url;?> ')"> 40 <header class="entry-header header page" style=" background-image: url('<?php echo $url;?> ')">
40 <div class="container" tabindex="-1" style=""> 41 <div class="content-container">
42 <div class="container" style="height: 100%;">
43 <div class="col-md-12 fx-style">
41 <div class="search-box"><div id="search-box-content"><?php the_field('page_search_block', 'option'); ?></div> <div class="search-button">Search</div></div> 44 <div class="search-box"><div id="search-box-content"><?php the_field('page_search_block', 'option'); ?></div> <div class="search-button">Search</div></div>
45 <div class="header_text">
46 <div class="breadcrumb"><?php get_breadcrumb(); ?></div>
47 <?php the_field('header_text'); ?>
48 </div>
49 <?php if($badge){
50 $badge_content = get_field('badge_content');
51 echo "<div class='badge'><span>".$badge_content['badge_label']."</span><div class='badge_content'><p>".$badge_content['badge_text']."</p></div></div>";
52 }?>
53 </div>
54
55 </div>
42 </div> 56 </div>
43 <div class='side-caption header-caption <?= (empty($copy) && empty($cap)) ? "hide" : "" ?>'> 57 <div class='side-caption header-caption <?= (empty($copy) && empty($cap)) ? "hide" : "" ?>'>
58
44 <a class='copy-link' aria-label="Header Slide Caption" href='#' ></a> 59 <a class='copy-link' aria-label="Header Slide Caption" href='#' ></a>
45 <span class='image-side-caption'> 60 <span class='image-side-caption'>
46 <span class='cap'><?= $photo_caption ?></span> 61 <span class='cap'><?= $photo_caption ?></span>
...@@ -49,13 +64,15 @@ if ($thumbnail_image && isset($thumbnail_image[0])) { ...@@ -49,13 +64,15 @@ if ($thumbnail_image && isset($thumbnail_image[0])) {
49 </div> 64 </div>
50 </header><!-- .entry-header --> 65 </header><!-- .entry-header -->
51 <?php } ?> 66 <?php } ?>
52 <div class="wrapper" id="page-wrapper"> 67 <div class="wrapper" id="full-width-page-wrapper">
53 68
54 <div class="<?php echo esc_attr( $container ); ?>" id="content" tabindex="-1"> 69 <div class="<?php echo esc_attr( $container ); ?>" id="content">
55 70
56 <main class="col-sm-12 col-md-12 content-area site-main site-main" id="main"> 71 <div class="col-md-12 content-area" id="primary">
57 72
58 <div class="breadcrumb"><?php get_breadcrumb(); ?></div> 73 <main class="site-main" id="main" role="main">
74
75 <div class="header_text mobile"><div class="breadcrumb"><?php get_breadcrumb(); ?></div> <?php the_field('header_text'); ?> </div>
59 76
60 <?php 77 <?php
61 while ( have_posts() ) { 78 while ( have_posts() ) {
...@@ -67,9 +84,11 @@ if ($thumbnail_image && isset($thumbnail_image[0])) { ...@@ -67,9 +84,11 @@ if ($thumbnail_image && isset($thumbnail_image[0])) {
67 84
68 </main><!-- #main --> 85 </main><!-- #main -->
69 86
87 </div><!-- #primary -->
88
70 </div><!-- #content --> 89 </div><!-- #content -->
71 90
72 </div><!-- #page-wrapper --> 91 </div><!-- #full-width-page-wrapper -->
73 92
74 <?php 93 <?php
75 get_footer(); 94 get_footer();
......
...@@ -23,7 +23,7 @@ jQuery(document).ready(function($) { ...@@ -23,7 +23,7 @@ jQuery(document).ready(function($) {
23 var PerView = 3 23 var PerView = 3
24 var offset =0; 24 var offset =0;
25 var space = 20; 25 var space = 20;
26 var SlidesPerGroup= 1; 26 var SlidesPerGroup= 3;
27 27
28 var _id = jQuery(this).parent().attr('id'); 28 var _id = jQuery(this).parent().attr('id');
29 29
...@@ -46,7 +46,7 @@ jQuery(document).ready(function($) { ...@@ -46,7 +46,7 @@ jQuery(document).ready(function($) {
46 slidesOffsetBefore: offset, 46 slidesOffsetBefore: offset,
47 spaceBetween: space, 47 spaceBetween: space,
48 slidesPerGroup: SlidesPerGroup , 48 slidesPerGroup: SlidesPerGroup ,
49 centeredSlides: true, 49 // centeredSlides: true,
50 loop: false, 50 loop: false,
51 lazy: true, 51 lazy: true,
52 pagination: { 52 pagination: {
...@@ -76,12 +76,12 @@ jQuery(document).ready(function($) { ...@@ -76,12 +76,12 @@ jQuery(document).ready(function($) {
76 76
77 77
78 }); 78 });
79 $('.carousel ').css('margin-left',"-"+$('#content').css('margin-left')); 79 // $('.carousel ').css('margin-left',"-"+$('#content').css('margin-left'));
80 80
81 $(window).on('resize', function(){ 81 // $(window).on('resize', function(){
82 $('.carousel ').css('margin-left',"-"+$('#content').css('margin-left')); 82 // $('.carousel ').css('margin-left',"-"+$('#content').css('margin-left'));
83 83
84 }); 84 // });
85 85
86 86
87 }); 87 });
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -7,7 +7,7 @@ function postItem(post_obj, size, sides, side_index, side_alternate, labels) { ...@@ -7,7 +7,7 @@ function postItem(post_obj, size, sides, side_index, side_alternate, labels) {
7 if(size == 2) { 7 if(size == 2) {
8 li += "<li class='article-card lg'><a href='"+post_obj['href']+"'>"; 8 li += "<li class='article-card lg'><a href='"+post_obj['href']+"'>";
9 if(post_obj['img_src']) { 9 if(post_obj['img_src']) {
10 li += "<div class='scale-wrapper'><img src='"+post_obj['img_src']+"' /></div>"; 10 li += "<div class='image-large'><div class='scale-wrapper'><img src='"+post_obj['img_src']+"' /></div><div class='overlay'></div></div>";
11 } 11 }
12 if(post_obj['title'].length > 100) { 12 if(post_obj['title'].length > 100) {
13 li += "<div class='content reduce'><p>"+post_obj['title']+"</p><span class='anchor-dots'></span></div>"; 13 li += "<div class='content reduce'><p>"+post_obj['title']+"</p><span class='anchor-dots'></span></div>";
...@@ -21,7 +21,7 @@ function postItem(post_obj, size, sides, side_index, side_alternate, labels) { ...@@ -21,7 +21,7 @@ function postItem(post_obj, size, sides, side_index, side_alternate, labels) {
21 } else { 21 } else {
22 li += "<li class='article-card sm'><a href='"+post_obj['href']+"'>"; 22 li += "<li class='article-card sm'><a href='"+post_obj['href']+"'>";
23 if(post_obj['img_src']) { 23 if(post_obj['img_src']) {
24 li += "<div class='image'><div class='scale-wrapper'><img src='"+post_obj['img_src']+"' /></div></div>"; 24 li += "<div class='image'><div class='scale-wrapper'><img src='"+post_obj['img_src']+"' /></div><div class='overlay'></div></div>";
25 } 25 }
26 if(post_obj['title'].length > 100) { 26 if(post_obj['title'].length > 100) {
27 li += "<div class='content reduce'><p>"+post_obj['title']+"</p>"; 27 li += "<div class='content reduce'><p>"+post_obj['title']+"</p>";
...@@ -194,7 +194,7 @@ jQuery(function($) { ...@@ -194,7 +194,7 @@ jQuery(function($) {
194 if($(that).parents('.related').find('.related-block.hidden[data-related-segment="'+(segment+1)+'"]').length == 0) { 194 if($(that).parents('.related').find('.related-block.hidden[data-related-segment="'+(segment+1)+'"]').length == 0) {
195 $(that).remove(); 195 $(that).remove();
196 } 196 }
197 }, 500); 197 }, 100);
198 198
199 }); 199 });
200 200
......
...@@ -7,6 +7,29 @@ var Search = (function($) { ...@@ -7,6 +7,29 @@ var Search = (function($) {
7 7
8 function init() { 8 function init() {
9 9
10 $('.search-box').css('margin-right', $('#main-nav .container').css('margin-right'));
11 $('.search-box').css('opacity', '1');
12
13 $('.badge').css('margin-right', $('#main-nav .container').css('margin-right'));
14 $('#pojo-a11y-toolbar').css('margin-right', $('#main-nav .container').css('margin-right'));
15
16 $('.badge').css('opacity', '1');
17 setTimeout(() => {
18 $('.badge').css('transition', '4s ease-in-out');
19 }, "100");
20
21 $(window).on('resize', function(){
22 $('.search-box').css('transition', '0s ease-in-out');
23 $('.search-box').css('margin-right', $('#main-nav .container').css('margin-right'));
24 $('#pojo-a11y-toolbar').css('margin-right', $('#main-nav .container').css('margin-right'));
25 $('.badge').css('transition', '0s ease-in-out');
26 $('.badge').css('margin-right', $('#main-nav .container').css('margin-right'));
27 setTimeout(() => {
28 $('.badge').css('transition', '4s ease-in-out');
29 $('.search-box').css('transition', 'all 0.5s ease-in-out 0s');
30 }, "100");
31 });
32
10 $(".searchandfilter ul li:contains('hidden')").hide(); 33 $(".searchandfilter ul li:contains('hidden')").hide();
11 $('<li class="sf-field-reset"><input type="submit" class="search-filter-reset-custom" value="CLEAR ALL" ></li>').appendTo( jQuery( '#advance-search-modal .searchandfilter ul:first-child ' ) ); 34 $('<li class="sf-field-reset"><input type="submit" class="search-filter-reset-custom" value="CLEAR ALL" ></li>').appendTo( jQuery( '#advance-search-modal .searchandfilter ul:first-child ' ) );
12 35
......
...@@ -4,7 +4,7 @@ import LazyLoad from "vanilla-lazyload"; ...@@ -4,7 +4,7 @@ import LazyLoad from "vanilla-lazyload";
4 import DataTable from 'datatables.net-dt'; 4 import DataTable from 'datatables.net-dt';
5 5
6 6
7 import "./_menu_mobile"; 7 //import "./_menu_mobile";
8 import "./_search"; 8 import "./_search";
9 import "./_header_menu"; 9 import "./_header_menu";
10 import "./_side_menu"; 10 import "./_side_menu";
......
1 .call-out-block{ 1 .call-out-block{
2 background-size: cover; 2 background-size: cover;
3 min-height: 18.75rem;
4 position: relative; 3 position: relative;
5 overflow: hidden; 4 overflow: hidden;
6 text-align: center; 5 text-align: center;
...@@ -10,7 +9,6 @@ ...@@ -10,7 +9,6 @@
10 color:#fff; 9 color:#fff;
11 margin-left:-50%; 10 margin-left:-50%;
12 margin-right:-50%; 11 margin-right:-50%;
13 margin-bottom: -1.5625rem;
14 margin-top: 1.5625rem; 12 margin-top: 1.5625rem;
15 padding-left:50%; 13 padding-left:50%;
16 padding-right:50%; 14 padding-right:50%;
...@@ -20,8 +18,10 @@ ...@@ -20,8 +18,10 @@
20 min-height: 15.625rem; 18 min-height: 15.625rem;
21 } 19 }
22 h2{ 20 h2{
21 padding-top: 32px;
23 @media screen and (max-width: 48rem) { 22 @media screen and (max-width: 48rem) {
24 font-size: 1.5rem; 23 font-size: 22px;
24 line-height: 25px;
25 } 25 }
26 26
27 } 27 }
...@@ -47,11 +47,11 @@ ...@@ -47,11 +47,11 @@
47 background-color: #EE0000; 47 background-color: #EE0000;
48 color: #fff; 48 color: #fff;
49 border: none; 49 border: none;
50 font-size: 1.1875rem; 50 font-size: 14px;
51 font-weight: 500; 51 font-weight: 500;
52 margin: 0.625rem 0 0rem 0; 52 margin: 24px 0 50px 0;
53 padding: 0.9375rem 3.75rem; 53 padding: 8px 46px;
54 line-height: 1.625rem; 54 line-height: 17px;
55 text-decoration: none; 55 text-decoration: none;
56 text-transform: uppercase; 56 text-transform: uppercase;
57 display: inline-block; 57 display: inline-block;
...@@ -59,8 +59,8 @@ ...@@ -59,8 +59,8 @@
59 border-radius: 2.5rem !important; 59 border-radius: 2.5rem !important;
60 font-weight: bold; 60 font-weight: bold;
61 @media screen and (max-width: 48rem) { 61 @media screen and (max-width: 48rem) {
62 font-size: 1rem; 62 font-size: 16px;
63 padding: 0.9375rem 1.875rem; 63
64 } 64 }
65 } 65 }
66 66
......
...@@ -18,10 +18,9 @@ ...@@ -18,10 +18,9 @@
18 // carousel css 18 // carousel css
19 .carousel:not(.is-admin) { 19 .carousel:not(.is-admin) {
20 background-color: transparent !important; 20 background-color: transparent !important;
21 left: -1.25rem; 21 left: -5%;
22 width: 100vw; 22 width: 110%;
23 margin-top: 1.875rem; 23 margin-top:24px;
24 margin-bottom: 1.875rem;
25 padding: 0rem 3.125rem; 24 padding: 0rem 3.125rem;
26 @media only screen and (max-width: 48.875rem) { 25 @media only screen and (max-width: 48.875rem) {
27 padding-right: 30px !important; 26 padding-right: 30px !important;
...@@ -36,21 +35,24 @@ ...@@ -36,21 +35,24 @@
36 display: flex; 35 display: flex;
37 justify-content: center; 36 justify-content: center;
38 align-items: center; 37 align-items: center;
39 max-width: 75rem; 38 //max-width: 75rem;
40 margin: 0 auto; 39 margin: 0 auto;
41 overflow: hidden; 40 overflow: hidden;
42 41
43 42
44 } 43 }
45 .carousel-content{ 44 .carousel-content{
46 padding: 0rem 3.125rem; 45 //padding: 0rem 3.125rem;
46 height: 260px;
47 @media only screen and (max-width: 48.875rem) { 47 @media only screen and (max-width: 48.875rem) {
48 padding: 0rem 0.625rem; 48 padding: 0rem 0.625rem;
49 } 49 }
50 } 50 }
51 .promo-image{ 51 .promo-image{
52 //width: 325px; 52 width: 340px;
53 height: 178px; 53 height: 186px;
54 overflow: hidden;
55 padding: 0px 4px;
54 @media only screen and (max-width: 48.875rem) { 56 @media only screen and (max-width: 48.875rem) {
55 width: 100%; 57 width: 100%;
56 height: auto; 58 height: auto;
...@@ -71,8 +73,8 @@ padding: 0rem 3.125rem; ...@@ -71,8 +73,8 @@ padding: 0rem 3.125rem;
71 text-align: left; 73 text-align: left;
72 } 74 }
73 .promo-text{ 75 .promo-text{
74 margin-left: 1.25rem; 76 margin-left: 0px;
75 margin-left: 1.25rem; 77 margin-top: 24px;
76 text-align: left; 78 text-align: left;
77 font-size: 1rem; 79 font-size: 1rem;
78 line-height: 1.5rem; 80 line-height: 1.5rem;
...@@ -87,7 +89,7 @@ padding: 0rem 3.125rem; ...@@ -87,7 +89,7 @@ padding: 0rem 3.125rem;
87 } 89 }
88 .understrap-read-more-link{ 90 .understrap-read-more-link{
89 font-weight: bold; 91 font-weight: bold;
90 text-transform: uppercase; 92 text-transform: capitalize;
91 text-decoration: none; 93 text-decoration: none;
92 94
93 } 95 }
...@@ -109,12 +111,13 @@ padding: 0rem 3.125rem; ...@@ -109,12 +111,13 @@ padding: 0rem 3.125rem;
109 111
110 .swiper-button-prev{ 112 .swiper-button-prev{
111 background-color: #EE0000; 113 background-color: #EE0000;
112
113 width:2.1875rem !important; 114 width:2.1875rem !important;
114 height:2.1875rem !important; 115 height:2.1875rem !important;
115 border: 0rem solid #EE0000; 116 border: 0rem solid #EE0000;
116 border-radius: 0rem 1.25rem 1.25rem 0rem; 117 border-radius: 1.25rem;
117 display: none; 118 display: none;
119 left: -15px !important;
120 top:calc(50% - 1rem) !important;
118 121
119 &:after{ 122 &:after{
120 content:"" !important; 123 content:"" !important;
...@@ -126,7 +129,7 @@ padding: 0rem 3.125rem; ...@@ -126,7 +129,7 @@ padding: 0rem 3.125rem;
126 display: inline-block; 129 display: inline-block;
127 position: absolute; 130 position: absolute;
128 top: 0.5rem; 131 top: 0.5rem;
129 left: 0.8125rem; 132 left: 11px;
130 } 133 }
131 134
132 } 135 }
...@@ -135,13 +138,14 @@ padding: 0rem 3.125rem; ...@@ -135,13 +138,14 @@ padding: 0rem 3.125rem;
135 background-color: #EE0000; 138 background-color: #EE0000;
136 139
137 right: 0rem !important; 140 right: 0rem !important;
141 top:calc(50% - 1rem) !important;
138 @media only screen and (max-width:25rem) { 142 @media only screen and (max-width:25rem) {
139 right: -0.625rem !important; 143 right: -0.625rem !important;
140 } 144 }
141 width:2.1875rem !important; 145 width:2.1875rem !important;
142 height:2.1875rem !important; 146 height:2.1875rem !important;
143 border: 0rem solid #EE0000; 147 border: 0rem solid #EE0000;
144 border-radius: 1.25rem 0rem 0rem 1.25rem; 148 border-radius: 1.25rem;
145 display: none; 149 display: none;
146 150
147 &:after{ 151 &:after{
......
...@@ -7,6 +7,8 @@ body{ ...@@ -7,6 +7,8 @@ body{
7 } 7 }
8 .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{ 8 .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{
9 max-width: 1067px !important; 9 max-width: 1067px !important;
10 padding-right: 0px;
11 padding-left: 0px;
10 } 12 }
11 13
12 @import "mega_menu"; 14 @import "mega_menu";
...@@ -30,3 +32,4 @@ body{ ...@@ -30,3 +32,4 @@ body{
30 @import "text_size_increased"; 32 @import "text_size_increased";
31 @import "relevant_resources"; 33 @import "relevant_resources";
32 @import "post_list_load_more"; 34 @import "post_list_load_more";
35
......
...@@ -251,9 +251,9 @@ blockquote{ ...@@ -251,9 +251,9 @@ blockquote{
251 251
252 252
253 .badge{ 253 .badge{
254 opacity: 0;
254 position: absolute; 255 position: absolute;
255 right: 0%; 256 right: 0%;
256 top: -3.125rem;
257 box-shadow: 0rem 0.1875rem 0.375rem #0000003D; 257 box-shadow: 0rem 0.1875rem 0.375rem #0000003D;
258 border-radius: 1.25rem; 258 border-radius: 1.25rem;
259 width: auto; 259 width: auto;
...@@ -261,8 +261,9 @@ blockquote{ ...@@ -261,8 +261,9 @@ blockquote{
261 z-index: 98; 261 z-index: 98;
262 padding: 0.625rem 1.25rem; 262 padding: 0.625rem 1.25rem;
263 background-color: #fff; 263 background-color: #fff;
264 transition: 4s ease-in-out; 264 transition: 0s ease-in-out;
265 color: #000000; 265 color: #000000;
266 bottom: 40px;
266 @media only screen and (max-width: 48.875rem) { 267 @media only screen and (max-width: 48.875rem) {
267 padding: 0.625rem 1.25rem; 268 padding: 0.625rem 1.25rem;
268 } 269 }
...@@ -302,7 +303,7 @@ blockquote{ ...@@ -302,7 +303,7 @@ blockquote{
302 font-size: 0.875rem; 303 font-size: 0.875rem;
303 line-height: 1.125rem; 304 line-height: 1.125rem;
304 font-weight: normal; 305 font-weight: normal;
305 color: #000000; 306 color: #000000 !important;
306 text-align: left; 307 text-align: left;
307 word-wrap: break-word; 308 word-wrap: break-word;
308 word-wrap: break-word; 309 word-wrap: break-word;
......
...@@ -39,6 +39,9 @@ ...@@ -39,6 +39,9 @@
39 padding-left: 0px; 39 padding-left: 0px;
40 display: inline-block; 40 display: inline-block;
41 padding-right: 0px; 41 padding-right: 0px;
42 @media only screen and (max-width: 48.875rem) {
43 display: block;
44 }
42 a{ 45 a{
43 color: #000; 46 color: #000;
44 font-size: 16px; 47 font-size: 16px;
...@@ -56,6 +59,9 @@ ...@@ -56,6 +59,9 @@
56 display: inline-block; 59 display: inline-block;
57 padding-left: 10px; 60 padding-left: 10px;
58 padding-right: 10px; 61 padding-right: 10px;
62 @media only screen and (max-width: 48.875rem) {
63 content: "";
64 }
59 } 65 }
60 li:last-of-type::after{ 66 li:last-of-type::after{
61 display: none; 67 display: none;
......
1 .home-header{ 1 .header{
2 position: relative; 2 position: relative;
3 height: 100%; 3 height: 100%;
4 overflow: hidden; 4 overflow: hidden;
...@@ -6,6 +6,9 @@ ...@@ -6,6 +6,9 @@
6 background-repeat: no-repeat; 6 background-repeat: no-repeat;
7 background-size: cover; 7 background-size: cover;
8 background-position: center; 8 background-position: center;
9 @media only screen and (max-width: 48.875rem) {
10 min-height: 260px;
11 }
9 12
10 img{ 13 img{
11 width: 100%; 14 width: 100%;
...@@ -23,13 +26,16 @@ ...@@ -23,13 +26,16 @@
23 font-weight: bold; 26 font-weight: bold;
24 text-align: left; 27 text-align: left;
25 margin-left: 0px; 28 margin-left: 0px;
29 margin-top: 0px;
26 @media only screen and (max-width: 48.875rem) { 30 @media only screen and (max-width: 48.875rem) {
27 font-size: 1.125rem; 31 font-size: 1.125rem;
28 line-height:1.375rem ; 32 line-height:1.375rem ;
29 } 33 }
30 } 34 }
31 35
32 .content-container{ 36 }
37
38 .content-container{
33 position: absolute; 39 position: absolute;
34 bottom: 0rem; 40 bottom: 0rem;
35 width: 100%; 41 width: 100%;
...@@ -39,6 +45,9 @@ ...@@ -39,6 +45,9 @@
39 max-height: 37.5rem; 45 max-height: 37.5rem;
40 justify-content: center; 46 justify-content: center;
41 background: transparent linear-gradient(180deg, #1A181800 0%, #000000 100%) 0% 0% no-repeat padding-box; 47 background: transparent linear-gradient(180deg, #1A181800 0%, #000000 100%) 0% 0% no-repeat padding-box;
48 @media only screen and (max-width: 48.875rem) {
49 background:transparent;
50 }
42 p{ 51 p{
43 color: #fff; 52 color: #fff;
44 font-size: 22px; 53 font-size: 22px;
...@@ -48,17 +57,62 @@ ...@@ -48,17 +57,62 @@
48 margin-bottom: 44px; 57 margin-bottom: 44px;
49 } 58 }
50 .fx-style{ 59 .fx-style{
60 max-width: 1067px!important;
61 margin: auto;
51 display: flex; 62 display: flex;
52 flex-direction: column; 63 flex-direction: column;
53 height: 100%; 64 height: 100%;
65 justify-content: flex-end;
66
54 } 67 }
55 68
69 }
70 .header.page{
71 h1{
72 font-size: 40px;
73 line-height: 45px;
74
56 } 75 }
76 p{
77 color: #fff;
78 font-size: 18px;
79 line-height: 24px;
57 80
58 81
82 }
83
84 .breadcrumb{
85 border-radius: 4px;
86 font-size: .75rem;
87 margin-bottom: 1.25rem;
88 background-color: #000;
89 color: #fff;
90 width: fit-content;
91 display: block;
92 position: relative;
93 padding: 0px 5px;
94 margin-bottom: 15px;
95 a{
96 text-decoration: none;
97 text-transform: capitalize;
98 color: #fff;
59 99
100 }
101 span{
102 margin: 0rem 0.625rem;
103 }
104 strong{
105 font-weight: normal;
106 }
107
108 }
109 .image-side-caption{
110 background: rgba(0,0,0,1);
111
112 }
60 } 113 }
61 114
115
62 .side-caption { 116 .side-caption {
63 &:hover, &:focus-within { 117 &:hover, &:focus-within {
64 bottom:0 !important; 118 bottom:0 !important;
...@@ -97,7 +151,7 @@ ...@@ -97,7 +151,7 @@
97 } 151 }
98 152
99 .image-side-caption { 153 .image-side-caption {
100 background: rgba(0,0,0,0.7); 154 background: rgba(0,0,0,1);
101 @media screen and (max-width: 48rem) { 155 @media screen and (max-width: 48rem) {
102 background: rgba(0,0,0,1); 156 background: rgba(0,0,0,1);
103 } 157 }
...@@ -117,3 +171,37 @@ ...@@ -117,3 +171,37 @@
117 color:white; 171 color:white;
118 } 172 }
119 } 173 }
174 .full-black{
175 background-color: #000;
176 margin-left: -50%;
177 margin-right: -50%;
178 padding-left: calc(50% - 5px);
179 padding-right:calc(50% - 5px);
180 padding-top: 31px;
181 padding-bottom: 20px;
182 h2{
183 color:#fff;
184 font-size: 22px;
185 line-height: 28px;
186 margin-bottom: 24px;
187
188 }
189 a{
190 color: #EE0000;
191 font-size: 18px;
192 line-height: 22px;
193 }
194 a:hover{
195 color:#669999;
196 text-decoration: none !important;
197
198 }
199 p{
200 color: #fff;
201 font-size: 16px;
202 line-height: 21px;
203 }
204 p:has(a){
205 margin-bottom: 12px;
206 }
207 }
...\ No newline at end of file ...\ No newline at end of file
......
1 .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal{ 1 .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal{
2 display: flex;
3 padding-top: 2px;
4 @media only screen and (max-width: 48.875rem) {
2 position: absolute; 5 position: absolute;
3 right: 20px; 6 right: 0px;
4 top: 15px; 7 top:-12px;
8 }
5 a{ 9 a{
6 color: #000; 10 color: #EE0000;
7 font-weight: bold; 11 font-weight: bold;
8 font-size: 22px; 12 font-size: 16px;
13 margin-right: 30px;
14 padding: 0px 10px 6px;
9 } 15 }
10 a:hover{ 16 a:hover{
11 color: #699!important; 17 color: #699!important;
12 } 18 }
19 .wpml-ls-link{
20 // padding: 0px;
21 }
13 } 22 }
14 23
15 .admin-bar .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal{ 24 .admin-bar .wpml-ls-statics-shortcode_actions.wpml-ls.wpml-ls-legacy-list-horizontal{
......
...@@ -12,6 +12,10 @@ ...@@ -12,6 +12,10 @@
12 padding-left: 1.6875rem; 12 padding-left: 1.6875rem;
13 margin-left: 30px; 13 margin-left: 30px;
14 text-decoration: none; 14 text-decoration: none;
15 width: calc(100% - 127px);
16 @media only screen and (max-width: 48.875rem) {
17 //width: calc(60% - 127px);
18 }
15 19
16 } 20 }
17 21
...@@ -23,6 +27,7 @@ ...@@ -23,6 +27,7 @@
23 margin-top: 0.9375rem; 27 margin-top: 0.9375rem;
24 z-index: 999; 28 z-index: 999;
25 position: relative; 29 position: relative;
30 width: 100%;
26 .navbar-brand{ 31 .navbar-brand{
27 margin-right:0px ; 32 margin-right:0px ;
28 width: 127px; 33 width: 127px;
...@@ -38,14 +43,17 @@ ...@@ -38,14 +43,17 @@
38 #main-nav{ 43 #main-nav{
39 box-shadow: 0rem 0.1875rem 0.375rem #00000029; 44 box-shadow: 0rem 0.1875rem 0.375rem #00000029;
40 //z-index: 9999; 45 //z-index: 9999;
46 @media only screen and (max-width: 48.875rem) {
47 height: 90PX;
48 }
41 } 49 }
42 #main-nav .container{ 50 #main-nav .container{
43 flex-direction: column; 51 flex-direction: column;
44 align-items: flex-start; 52 align-items: flex-start;
45 margin-bottom: 0.625rem; 53 margin-bottom: 0.625rem;
46 @media only screen and (max-width: 62.5rem) { 54 @media only screen and (max-width: 62.5rem) {
47 height: 5.625rem; 55 height: 90px;
48 padding-top: 1.5625rem; 56 padding-top:0px;
49 margin-bottom: 0rem; 57 margin-bottom: 0rem;
50 58
51 } 59 }
...@@ -54,13 +62,16 @@ ...@@ -54,13 +62,16 @@
54 62
55 @media only screen and (max-width: 62.5rem) { 63 @media only screen and (max-width: 62.5rem) {
56 .branding{ 64 .branding{
57 margin-top: 0rem; 65 margin-top: 6px;
66 padding-left: 15px;
58 } 67 }
59 .site-title{ 68 .site-title{
60 font-size: 1.25rem; 69 font-size: 1.25rem;
61 line-height: 1.5rem; 70 line-height: 1.5rem;
62 margin-left: 0rem; 71 margin-left: 0rem;
63 padding-left: 1.2rem; 72 padding-left: 1.2rem;
73 height: 33px;
74 align-self: end;
64 75
65 } 76 }
66 .navbar-brand{ 77 .navbar-brand{
...@@ -90,6 +101,9 @@ ...@@ -90,6 +101,9 @@
90 background-color: #fff; 101 background-color: #fff;
91 z-index: 99; 102 z-index: 99;
92 top: 0rem; 103 top: 0rem;
104 @media only screen and (max-width: 48.875rem) {
105 height: 90px;
106 }
93 } 107 }
94 108
95 .admin-bar #wrapper-navbar { 109 .admin-bar #wrapper-navbar {
......
...@@ -315,7 +315,7 @@ ...@@ -315,7 +315,7 @@
315 #mega-menu-wrap-primary{ 315 #mega-menu-wrap-primary{
316 width: 100%; 316 width: 100%;
317 height: 1.875rem; 317 height: 1.875rem;
318 top: 3.4375rem; 318 top: 2.4375rem;
319 right: 0rem; 319 right: 0rem;
320 position:absolute; 320 position:absolute;
321 background: transparent; 321 background: transparent;
...@@ -326,10 +326,11 @@ ...@@ -326,10 +326,11 @@
326 #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-blocks-right .mega-toggle-block:only-child{ 326 #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-blocks-right .mega-toggle-block:only-child{
327 background-color: #EE0000; 327 background-color: #EE0000;
328 border-radius: 50%; 328 border-radius: 50%;
329 width: 2.5rem; 329 width: 35px;
330 height: 2.5rem; 330 height: 35px;
331 margin-right: 0.9375rem; 331 margin-right: 0.9375rem;
332 } 332 }
333
333 #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-blocks-right .mega-toggle-block:active:only-child{ 334 #mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-blocks-right .mega-toggle-block:active:only-child{
334 background-color: #669999; 335 background-color: #669999;
335 336
...@@ -442,6 +443,11 @@ ...@@ -442,6 +443,11 @@
442 color: #fff; 443 color: #fff;
443 margin: 0rem 0 0 0.3813rem; 444 margin: 0rem 0 0 0.3813rem;
444 line-height: 2.5rem; 445 line-height: 2.5rem;
446 @media only screen and (max-width: 62.5rem) {
447 line-height: 35px;
448 font-size: 23px;
449 }
450
445 } 451 }
446 452
447 #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:hover > a{ 453 #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:hover > a{
......
...@@ -44,7 +44,7 @@ ...@@ -44,7 +44,7 @@
44 background-size: cover; 44 background-size: cover;
45 background-position: center; 45 background-position: center;
46 @media screen and (max-width: 59.375rem) { 46 @media screen and (max-width: 59.375rem) {
47 min-height: 430px; 47 min-height: 260px;
48 } 48 }
49 } 49 }
50 .search-box:hover, 50 .search-box:hover,
...@@ -52,9 +52,13 @@ ...@@ -52,9 +52,13 @@
52 width: 100%; 52 width: 100%;
53 height: 90px; 53 height: 90px;
54 max-width: 1066px; 54 max-width: 1066px;
55 position: relative; 55 position: absolute;
56 margin: auto; 56 right: 0px;
57 right: unset; 57
58 @media only screen and (max-width: 48.875rem) {
59 width: 95%;
60 right: 2.5%;
61 }
58 62
59 63
60 } 64 }
...@@ -85,23 +89,24 @@ ...@@ -85,23 +89,24 @@
85 89
86 90
87 .search-box{ 91 .search-box{
92 opacity: 0;
88 background-color: #fff; 93 background-color: #fff;
89 border-radius: 1.25rem ; 94 border-radius: 1.25rem ;
90 max-width: 80%; 95 max-width:1067px;
91 margin: auto; 96 margin: auto;
92 top: 2.5rem; 97 position: absolute;
93 position: relative; 98 top:0px;
94 box-shadow: -2px 7px 7px 0 rgba(0,0,0,.25); 99 box-shadow: -2px 7px 7px 0 rgba(0,0,0,.25);
95 transition: 0.5s ease-in-out; 100 transition: 0.5s ease-in-out;
96 height: 56px; 101 height: 56px;
97 width: 56px; 102 width: 56px;
98 float: right; 103 right: 0px;
99 overflow: hidden; 104 overflow: hidden;
100 @media only screen and (max-width: 48.875rem) { 105 @media only screen and (max-width: 48.875rem) {
101 padding: 0rem 0.625rem ; 106 padding: 0rem 0.625rem ;
102 max-width: 90%; 107 max-width: 90%;
103 right: 5%; 108 right: 5%;
104 margin-top: 3.5rem; 109 margin-top: .5rem;
105 } 110 }
106 111
107 .search-button{ 112 .search-button{
...@@ -237,15 +242,16 @@ ...@@ -237,15 +242,16 @@
237 right: 0.625rem; 242 right: 0.625rem;
238 } 243 }
239 244
240 #page-wrapper{ 245 #full-width-page-wrapper{
241 margin: 0.625rem 1.875rem 0 1.875rem; 246 margin: 0.625rem 1.875rem 0 1.875rem;
242 min-height: 50vh; 247 min-height: 50vh;
248 padding-bottom: 0px;
243 @media(max-width: 48rem) { 249 @media(max-width: 48rem) {
244 // margin: 2.5rem 2.5rem 0 2.5rem; 250 // margin: 2.5rem 2.5rem 0 2.5rem;
245 } 251 }
246 .breadcrumb{ 252 .breadcrumb{
247 font-size: 0.75rem; 253 font-size: 0.75rem;
248 margin-bottom: 1.25rem; 254 margin-bottom: 0.25rem;
249 a{ 255 a{
250 text-decoration: none; 256 text-decoration: none;
251 text-transform: capitalize; 257 text-transform: capitalize;
...@@ -255,13 +261,14 @@ min-height: 50vh; ...@@ -255,13 +261,14 @@ min-height: 50vh;
255 } 261 }
256 262
257 263
258 } 264 }
265
259 h1{ 266 h1{
260 font-size: 2.8125rem; 267 font-size: 36px;
261 line-height: 3.25rem; 268 line-height: 40px;
262 font-weight: bold; 269 font-weight: bold;
263 } 270 }
264 h1+p { 271 .entry-content p:first-of-type {
265 font-weight: bold; 272 font-weight: bold;
266 } 273 }
267 } 274 }
...@@ -452,3 +459,22 @@ h1+p { ...@@ -452,3 +459,22 @@ h1+p {
452 459
453 } 460 }
454 } 461 }
462 .fx-style{
463 .header_text{
464 display: block;
465 @media only screen and (max-width: 48.875rem) {
466 display: none;
467 }
468 }
469 }
470 .header_text.mobile{
471 display: none;
472 margin-bottom: 24px;
473 p{
474 font-size: 18px;
475 line-height: 24px;
476 }
477 @media only screen and (max-width: 48.875rem) {
478 display: block;
479 }
480 }
......
...@@ -20,8 +20,9 @@ ...@@ -20,8 +20,9 @@
20 20
21 } 21 }
22 #pojo-a11y-toolbar{ 22 #pojo-a11y-toolbar{
23 position: absolute; 23 position: relative;
24 top: 1.25rem; 24 top: 1.25rem;
25
25 @media screen and (max-width: 62.5rem){ 26 @media screen and (max-width: 62.5rem){
26 top: 0rem; 27 top: 0rem;
27 } 28 }
...@@ -32,20 +33,21 @@ ...@@ -32,20 +33,21 @@
32 } 33 }
33 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle{ 34 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle{
34 z-index: 9999 !important; 35 z-index: 9999 !important;
35 right: 115px !important; 36
36 } 37 }
37 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle a{ 38 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle a{
38 width:40px; 39 width:20px;
39 box-shadow:none !important; 40 box-shadow:none !important;
40 position: absolute; 41 position: absolute;
42 padding-left: 5px !important;
41 //right: -16.875rem!important; 43 //right: -16.875rem!important;
42 44
43 } 45 }
44 46
45 .pojo-a11y-toolbar-overlay { 47 .pojo-a11y-toolbar-overlay {
46 position: absolute; 48 position: relative;
47 top: 3.125rem; 49 top: 3.125rem;
48 right: 0rem; 50
49 display: none; 51 display: none;
50 border-radius: 0rem 0rem 0.625rem 0.625rem; 52 border-radius: 0rem 0rem 0.625rem 0.625rem;
51 svg{ 53 svg{
...@@ -58,40 +60,39 @@ ...@@ -58,40 +60,39 @@
58 60
59 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle svg { 61 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle svg {
60 max-width: inherit; 62 max-width: inherit;
61 border: 0.125rem #000 solid; 63 border: 1px #000 solid;
62 border-radius: 50%; 64 border-radius: 50%;
63 padding: 0.1875rem; 65 padding: 0.1875rem;
64 height: 1.75rem; 66 height:20px;
65 width: 1.75rem; 67 width:20px;
66 } 68 }
67 69
68 .pojo-a11y-toolbar-open{ 70 .pojo-a11y-toolbar-open{
69 z-index: 99999; 71 z-index: 99999;
70 .pojo-a11y-toolbar-toggle svg { 72 .pojo-a11y-toolbar-toggle svg {
71 border: 0.125rem #669999 solid !important; 73 border: 1px #669999 solid !important;
72 color: #669999; 74 color: #669999;
73 } 75 }
74 .pojo-a11y-toolbar-toggle a{ 76 .pojo-a11y-toolbar-toggle a{
75 color: #669999; 77 color: #669999;
76 text-decoration: none; 78 text-decoration: none;
79 background-color: transparent !important;
77 } 80 }
78 .pojo-a11y-toolbar-overlay { 81 .pojo-a11y-toolbar-overlay {
79 position: absolute; 82 position: absolute;
80 top: 3.125rem; 83 top: 3.125rem;
81 right: 0rem; 84 right: 0rem;
82 display:block; 85 display:block;
83 86 @media screen and (max-width: 62.5rem){
87 top: 2.125rem;
88 }
84 } 89 }
85 } 90 }
86 #gt_float_wrapper .gt_float_switcher{ 91 #gt_float_wrapper .gt_float_switcher{
87 background-color: transparent !important; 92 background-color: transparent !important;
88 } 93 }
89 94
90 [lang="zh-CN"]{ 95
91 #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle a{
92 right: -15rem!important;
93 }
94 }
95 .pojo-a11y-toolbar-text{ 96 .pojo-a11y-toolbar-text{
96 font-size: 1rem; 97 font-size: 1rem;
97 } 98 }
...@@ -111,7 +112,7 @@ ...@@ -111,7 +112,7 @@
111 .pojo-a11y-toolbar-toggle-link:hover{ 112 .pojo-a11y-toolbar-toggle-link:hover{
112 color: #669999 !important; 113 color: #669999 !important;
113 svg { 114 svg {
114 border: 0.125rem #669999 solid !important; 115 border: 1px #669999 solid !important;
115 } 116 }
116 117
117 } 118 }
...@@ -119,5 +120,32 @@ ...@@ -119,5 +120,32 @@
119 text-decoration: none; 120 text-decoration: none;
120 } 121 }
121 122
123 .pojo-a11y-toolbar-inner::before{
124 content: "";
125 display: block;
126 width: 90%;
127 height: 1px;
128 background-color: #ccc;
129 margin: auto;
122 130
123
...\ No newline at end of file ...\ No newline at end of file
131 }
132 #pojo-a11y-toolbar.pojo-a11y-toolbar-right .pojo-a11y-toolbar-toggle{
133 right: 40px !important;
134 }
135 .pojo-a11y-toolbar-open{
136 .pojo-a11y-toolbar-link.pojo-a11y-toolbar-toggle-link::after{
137 content: "";
138 display: block;
139 position: relative;
140 margin-top: 6px;
141 margin-bottom: 10px;
142 margin-left: 4px;
143 width: 13px;
144 height: 7px;
145 background-repeat: no-repeat;
146 background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12.742" height="7.726" viewBox="0 0 12.742 7.726"><path id="Path_1502" data-name="Path 1502" d="M6.383,4.709c.442-.447.875-.89,1.313-1.328Q9.274,1.8,10.855.231a.708.708,0,0,1,1.047,0c.2.206.405.407.608.61a.694.694,0,0,1,0,1.038L9.667,4.721,6.913,7.48a.768.768,0,0,1-.515.246.734.734,0,0,1-.567-.245Q4.769,6.415,3.706,5.349L.812,2.454c-.2-.2-.395-.393-.591-.591A.69.69,0,0,1,.228.844l.6-.6a.708.708,0,0,1,1.062,0L4.456,2.792,6.311,4.64Z"/></svg>');
147 @media screen and (max-width: 62.5rem){
148 display: none;
149 }
150 }
151 }
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
3 flex-direction: row-reverse; 3 flex-direction: row-reverse;
4 flex-wrap: wrap; 4 flex-wrap: wrap;
5 justify-content: center; 5 justify-content: center;
6 margin:2.25rem 0; 6 margin:24px 0;
7 7
8 .post-list-left-col { 8 .post-list-left-col {
9 flex-basis: 50%; 9 flex-basis: 50%;
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
24 list-style: none; 24 list-style: none;
25 padding:0; 25 padding:0;
26 margin:0; 26 margin:0;
27 gap: 24px; 27 gap: 12px;
28 .article-card { 28 .article-card {
29 min-height: 117px; 29 min-height: 117px;
30 // max-height: 8.438rem; 30 // max-height: 8.438rem;
...@@ -34,12 +34,29 @@ ...@@ -34,12 +34,29 @@
34 text-decoration: none; 34 text-decoration: none;
35 } 35 }
36 &.lg { 36 &.lg {
37 min-height: 30.438rem; 37
38 max-height: 30.438rem; 38 min-height: 28rem;
39 max-height: 28rem;
40 .image-large{
41 position: relative;
42 }
43 .overlay{
44 position: absolute;
45 top: 0;
46 bottom: 0;
47 left: 0;
48 right: 0;
49 height: 100%;
50 width: 100%;
51 transition: .5s ease;
52 background-color: transparent;
53 }
54
39 .scale-wrapper { 55 .scale-wrapper {
40 min-height: 291px; 56 min-height: 291px;
41 max-height: 291px; 57 max-height: 291px;
42 overflow: hidden; 58 overflow: hidden;
59 position: relative;
43 } 60 }
44 img { 61 img {
45 height: 100%; 62 height: 100%;
...@@ -52,6 +69,18 @@ ...@@ -52,6 +69,18 @@
52 } 69 }
53 } 70 }
54 &.sm { 71 &.sm {
72
73 .overlay{
74 position: absolute;
75 top: 0;
76 bottom: 0;
77 left: 0;
78 right: 0;
79 height: 100%;
80 width: 100%;
81 transition: .5s ease;
82 background-color: transparent;
83 }
55 .content { 84 .content {
56 padding-bottom:0; //not sure why this was 1rem 85 padding-bottom:0; //not sure why this was 1rem
57 line-height: 1.125rem; 86 line-height: 1.125rem;
...@@ -61,13 +90,16 @@ ...@@ -61,13 +90,16 @@
61 transition: transform .3s; 90 transition: transform .3s;
62 } 91 }
63 &:hover { 92 &:hover {
93 .overlay{
94 background: rgba(0,0,0,0.4);
95 }
64 a { 96 a {
65 color: #699; 97 color: #699;
66 text-decoration: underline; 98 text-decoration: underline;
67 } 99 }
68 img { 100 img {
69 transform: scale(1.05); 101 // transform: scale(1.05);
70 opacity: 0.8; 102 //opacity: 0.8;
71 } 103 }
72 } 104 }
73 } 105 }
...@@ -77,13 +109,14 @@ ...@@ -77,13 +109,14 @@
77 109
78 110
79 .article-card { 111 .article-card {
80 max-width: 31.875rem; 112 max-width: 31rem;
81 min-width: 31.875rem; 113 min-width: 31rem;
82 min-height: 8.438rem; 114 min-height: 8.438rem;
83 a { 115 a {
84 color:white; 116 color:white;
85 gap: 1.625rem; 117 gap: 1.625rem;
86 &:hover { 118 &:hover {
119
87 p { 120 p {
88 text-decoration: underline; 121 text-decoration: underline;
89 font-size: 18px; 122 font-size: 18px;
...@@ -99,6 +132,9 @@ ...@@ -99,6 +132,9 @@
99 a { 132 a {
100 flex-direction: column; 133 flex-direction: column;
101 } 134 }
135 a:hover{
136
137 }
102 .content { 138 .content {
103 min-height: 8.25rem; 139 min-height: 8.25rem;
104 padding-top:1rem; 140 padding-top:1rem;
...@@ -169,6 +205,7 @@ ...@@ -169,6 +205,7 @@
169 max-height: 117px; 205 max-height: 117px;
170 object-fit: cover; 206 object-fit: cover;
171 overflow: hidden; 207 overflow: hidden;
208 position: relative;
172 img { 209 img {
173 object-fit: cover; 210 object-fit: cover;
174 height: 100%; 211 height: 100%;
...@@ -198,6 +235,20 @@ ...@@ -198,6 +235,20 @@
198 } 235 }
199 } 236 }
200 237
238 .load-more-link-out{
239 border-radius: 40px;
240 padding: 8px 88px;
241 background: #EE0000;
242 text-transform: uppercase;
243 font-size: 14px;
244 color: #fff;
245 font-weight: bold;
246 }
247 .load-more-link-out:hover{
248 background: #669999;
249 color: #fff;
250 }
251
201 252
202 .mobile-article-list { 253 .mobile-article-list {
203 display: none; 254 display: none;
......
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
25 } 25 }
26 26
27 .content{ 27 .content{
28 width: 50%; 28 width: 66.66%;
29 display: flex; 29 display: flex;
30 flex-direction: column; 30 flex-direction: column;
31 justify-content: flex-start; 31 justify-content: flex-start;
...@@ -33,10 +33,15 @@ ...@@ -33,10 +33,15 @@
33 @media screen and (max-width: 56.25rem) { 33 @media screen and (max-width: 56.25rem) {
34 width: 100%; 34 width: 100%;
35 } 35 }
36 p{
37 font-weight: normal !important;
38 font-size: 16px;
39 line-height: 20px;
40 }
36 } 41 }
37 .image{ 42 .image{
38 background-size: cover; 43 background-size: cover;
39 width: 50%; 44 width: 33.33%;
40 overflow: hidden; 45 overflow: hidden;
41 border-radius: 0rem 0rem 1.25rem 1.25rem; 46 border-radius: 0rem 0rem 1.25rem 1.25rem;
42 position: relative; 47 position: relative;
......