@import url("//hello.myfonts.net/count/32fd5b");@import url("//fast.fonts.net/t/1.css?apiType=css&projectid=42127ea0-53f8-4242-8593-40c97f177709");html{box-sizing:border-box;}*,*::after,*::before{box-sizing:inherit;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block;}audio,canvas,progress,video{display:inline-block;}audio:not([controls]){display:none;height:0;}progress{vertical-align:baseline;}template,[hidden]{display:none;}a{background-color:transparent;-webkit-text-decoration-skip:objects;}a:active,a:hover{outline-width:0;}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:inherit;}b,strong{font-weight:bolder;}dfn{font-style:italic;}h1{font-size:2em;margin:0.67em 0;}mark{background-color:#ff0;color:#000;}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sub{bottom:-0.25em;}sup{top:-0.5em;}img{border-style:none;}svg:not(:root){overflow:hidden;}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em;}figure{margin:1em 40px;}hr{box-sizing:content-box;height:0;overflow:visible;}button,input,select,textarea{font:inherit;margin:0;}optgroup{font-weight:bold;}button,input{overflow:visible;}button,select{text-transform:none;}button,html [type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0;}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}textarea{overflow:auto;}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto;}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}::-webkit-input-placeholder{color:inherit;opacity:0.54;}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}@font-face{font-family:"mark-pro";font-style:normal;font-weight:normal;src:url("../fonts/mark-pro/32FD5B_1_0.eot?#iefix") format("embedded-opentype"),url("../fonts/mark-pro/32FD5B_1_0.woff2") format("woff2"),url("../fonts/mark-pro/32FD5B_1_0.woff") format("woff"),url("../fonts/mark-pro/32FD5B_1_0.ttf") format("truetype"),url("../fonts/mark-pro/32FD5B_1_0.svg#mark-pro") format("svg");}@font-face{font-family:"mark-pro";font-style:italic;font-weight:normal;src:url("../fonts/mark-pro/32FD5B_4_0.eot?#iefix") format("embedded-opentype"),url("../fonts/mark-pro/32FD5B_4_0.woff2") format("woff2"),url("../fonts/mark-pro/32FD5B_4_0.woff") format("woff"),url("../fonts/mark-pro/32FD5B_4_0.ttf") format("truetype"),url("../fonts/mark-pro/32FD5B_4_0.svg#mark-pro") format("svg");}@font-face{font-family:"mark-pro";font-style:normal;font-weight:bold;src:url("../fonts/mark-pro/32FD5B_0_0.eot?#iefix") format("embedded-opentype"),url("../fonts/mark-pro/32FD5B_0_0.woff2") format("woff2"),url("../fonts/mark-pro/32FD5B_0_0.woff") format("woff"),url("../fonts/mark-pro/32FD5B_0_0.ttf") format("truetype"),url("../fonts/mark-pro/32FD5B_0_0.svg#mark-pro") format("svg");}@font-face{font-family:"mark-pro";font-style:italic;font-weight:bold;src:url("../fonts/mark-pro/32FD5B_2_0.eot?#iefix") format("embedded-opentype"),url("../fonts/mark-pro/32FD5B_2_0.woff2") format("woff2"),url("../fonts/mark-pro/32FD5B_2_0.woff") format("woff"),url("../fonts/mark-pro/32FD5B_2_0.ttf") format("truetype"),url("../fonts/mark-pro/32FD5B_2_0.svg#mark-pro") format("svg");}@font-face{font-family:"mark-pro-bold";font-style:normal;font-weight:normal;src:url("../fonts/mark-pro/32FD5B_6_0.eot?#iefix") format("embedded-opentype"),url("../fonts/mark-pro/32FD5B_6_0.woff2") format("woff2"),url("../fonts/mark-pro/32FD5B_6_0.woff") format("woff"),url("../fonts/mark-pro/32FD5B_6_0.ttf") format("truetype"),url("../fonts/mark-pro/32FD5B_6_0.svg#mark-pro-bold") format("svg");}@font-face{font-family:"mark-pro-bold";font-style:italic;font-weight:normal;src:url("../fonts/mark-pro/32FD5B_5_0.eot?#iefix") format("embedded-opentype"),url("../fonts/mark-pro/32FD5B_5_0.woff2") format("woff2"),url("../fonts/mark-pro/32FD5B_5_0.woff") format("woff"),url("../fonts/mark-pro/32FD5B_5_0.ttf") format("truetype"),url("../fonts/mark-pro/32FD5B_5_0.svg#mark-pro-bold") format("svg");}@font-face{font-family:"Univers49";src:url("../fonts/univers/c5ac8b78-594b-4ba2-acf3-aa4e2977b48e.eot?#iefix");src:url("../fonts/univers/c5ac8b78-594b-4ba2-acf3-aa4e2977b48e.eot?#iefix") format("eot"),url("../fonts/univers/315eba9a-1de1-4947-9e48-e36be51ceaf9.woff2") format("woff2"),url("../fonts/univers/e28e2802-76b7-4961-87fd-2db3819775d1.woff") format("woff"),url("../fonts/univers/14c479c8-e060-4c89-a6a8-5e3f6d874b89.ttf") format("truetype"),url("../fonts/univers/0aff3dae-f88e-4024-be1d-35280dfbec9c.svg#0aff3dae-f88e-4024-be1d-35280dfbec9c") format("svg");}@font-face{font-family:'icomoon';src:url("../fonts/icomoon/icomoon.eot?a0ft7l");src:url("../fonts/icomoon/icomoon.eot?a0ft7l#iefix") format("embedded-opentype"),url("../fonts/icomoon/icomoon.ttf?a0ft7l") format("truetype"),url("../fonts/icomoon/icomoon.woff?a0ft7l") format("woff"),url("../fonts/icomoon/icomoon.svg?a0ft7l#icomoon") format("svg");font-weight:normal;font-style:normal;}[class^="icon-"],[class*=" icon-"]{font-family:'icomoon'!important;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}.icon-gallery:before{content:"\e907";}.icon-arrow-left:before{content:"\e904";}.icon-arrow-right:before{content:"\e905";}.icon-close:before{content:"\e906";}.icon-youtube:before{content:"\e901";}.icon-instagram:before{content:"\e902";}.icon-pinterest:before{content:"\e903";}.icon-cta-arrow-prev:before{content:"\e908";}.icon-cta-arrow:before{content:"\e900";}.icon-twitter:before{content:"\e619";}.icon-linkedin:before{content:"\e601";}.icon-facebook:before{content:"\e61a";}.icon-google-plus:before{content:"\ea88";}.icon-flickr:before{content:"\eaa0";}fieldset{background-color:transparent;border:0;margin:0;padding:0;}legend{font-weight:600;margin-bottom:0.425em;padding:0;}label{display:block;font-weight:600;margin-bottom:0.425em;}input,select,textarea{display:block;font-family:"mark-pro",arial,serif;font-size:1em;}input[type="color"],input[type="date"],input[type="datetime"],input[type="datetime-local"],input[type="email"],input[type="month"],input[type="number"],input[type="password"],input[type="search"],input[type="tel"],input[type="text"],input[type="time"],input[type="url"],input[type="week"],input:not([type]),textarea{appearance:none;background-color:#fafafa;border:1px solid #d6d6d6;border-radius:0;box-shadow:none;box-sizing:border-box;margin-bottom:0.85em;padding:0.56667em;transition:border-color 250ms ease;width:100%;}input[type="color"]:hover,input[type="date"]:hover,input[type="datetime"]:hover,input[type="datetime-local"]:hover,input[type="email"]:hover,input[type="month"]:hover,input[type="number"]:hover,input[type="password"]:hover,input[type="search"]:hover,input[type="tel"]:hover,input[type="text"]:hover,input[type="time"]:hover,input[type="url"]:hover,input[type="week"]:hover,input:not([type]):hover,textarea:hover{border-color:#ababab;}input[type="color"]:focus,input[type="date"]:focus,input[type="datetime"]:focus,input[type="datetime-local"]:focus,input[type="email"]:focus,input[type="month"]:focus,input[type="number"]:focus,input[type="password"]:focus,input[type="search"]:focus,input[type="tel"]:focus,input[type="text"]:focus,input[type="time"]:focus,input[type="url"]:focus,input[type="week"]:focus,input:not([type]):focus,textarea:focus{border-color:#79bde9;box-shadow:none,0 0 5px rgba(245,146,6,0.7);outline:none;}input[type="color"]:disabled,input[type="date"]:disabled,input[type="datetime"]:disabled,input[type="datetime-local"]:disabled,input[type="email"]:disabled,input[type="month"]:disabled,input[type="number"]:disabled,input[type="password"]:disabled,input[type="search"]:disabled,input[type="tel"]:disabled,input[type="text"]:disabled,input[type="time"]:disabled,input[type="url"]:disabled,input[type="week"]:disabled,input:not([type]):disabled,textarea:disabled{background-color:#eeeeee;cursor:not-allowed;}input[type="color"]:disabled:hover,input[type="date"]:disabled:hover,input[type="datetime"]:disabled:hover,input[type="datetime-local"]:disabled:hover,input[type="email"]:disabled:hover,input[type="month"]:disabled:hover,input[type="number"]:disabled:hover,input[type="password"]:disabled:hover,input[type="search"]:disabled:hover,input[type="tel"]:disabled:hover,input[type="text"]:disabled:hover,input[type="time"]:disabled:hover,input[type="url"]:disabled:hover,input[type="week"]:disabled:hover,input:not([type]):disabled:hover,textarea:disabled:hover{border:1px solid #d6d6d6;}input[type="color"]::placeholder,input[type="date"]::placeholder,input[type="datetime"]::placeholder,input[type="datetime-local"]::placeholder,input[type="email"]::placeholder,input[type="month"]::placeholder,input[type="number"]::placeholder,input[type="password"]::placeholder,input[type="search"]::placeholder,input[type="tel"]::placeholder,input[type="text"]::placeholder,input[type="time"]::placeholder,input[type="url"]::placeholder,input[type="week"]::placeholder,input:not([type])::placeholder,textarea::placeholder{color:#b3b3b3;}textarea{resize:vertical;}[type="checkbox"],[type="radio"]{display:inline;margin-right:0.425em;}[type="file"]{margin-bottom:0.85em;width:100%;}select{margin-bottom:0.85em;width:100%;}input[type="submit"],button[type="submit"]{-webkit-appearance:none;appearance:none;display:inline-block;padding:12px 30px;background:#79bde9;border:none;border-radius:8px;color:#fff;font-family:"mark-pro-bold",arial,serif;font-size:0.875rem;line-height:1em;text-shadow:none;cursor:pointer;transition:background 250ms ease;}input[type="submit"]:hover,input[type="submit"]:focus,button[type="submit"]:hover,button[type="submit"]:focus{color:#fff;background:#1458a3;}form p+p,form ul+p{margin-top:25px;}form ul{list-style:none;padding-left:1rem;}form .helptext{display:block;margin-top:-5px;font-size:0.875rem;font-style:italic;}form[action^="https://www.pages08.net"] td{border-bottom:none;}figure{margin:0;}img,picture{margin:0;max-width:100%;}table{border-collapse:collapse;margin:0.85em 0;table-layout:fixed;width:100%;}th{border-bottom:1px solid #a1a1a1;font-weight:600;padding:0.85em 0;text-align:left;}td{border-bottom:1px solid #d6d6d6;padding:0.85em 0;}tr,td,th{vertical-align:middle;}.primary-button,.primary-button--reversed{position:relative;display:inline-block;width:114px;height:46px;padding-top:10px;text-align:center;color:#fff;font-size:1rem;font-family:"mark-pro-bold",arial,serif;z-index:1;}.primary-button:before,.primary-button:after,.primary-button--reversed:before,.primary-button--reversed:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:url(../img/primary-button-background.svg) no-repeat center;background-size:contain;opacity:1;z-index:-1;transition:opacity 250ms ease;}.primary-button:after,.primary-button--reversed:after{background-image:url(../img/primary-button-background-hover.svg);opacity:0;z-index:-2;}.primary-button:hover,.primary-button:focus,.primary-button--reversed:hover,.primary-button--reversed:focus{color:#fff;}.primary-button:hover:before,.primary-button:focus:before,.primary-button--reversed:hover:before,.primary-button--reversed:focus:before{opacity:0;}.primary-button:hover:after,.primary-button:focus:after,.primary-button--reversed:hover:after,.primary-button--reversed:focus:after{opacity:1;}.primary-button--reversed{color:#79bde9;}.primary-button--reversed:before{background-image:url(../img/primary-button-background-reversed.svg);}.primary-button--reversed:after{background-image:url(../img/primary-button-background-hover.svg);}.secondary-button{color:#f99d1c;font-family:"mark-pro-bold",arial,serif;font-size:0.875rem;}.secondary-button .icon-cta-arrow{margin-left:5px;font-size:0.625rem;}.secondary-button .icon-cta-arrow-prev{margin-right:5px;font-size:0.625rem;}.tertiary-button{display:inline-block;padding:12px 30px;background:#79bde9;border:none;border-radius:8px;color:#fff;font-family:"mark-pro-bold",arial,serif;font-size:0.875rem;line-height:1em;cursor:pointer;transition:background 250ms ease;}.tertiary-button:hover,.tertiary-button:focus{color:#fff;background:#1458a3;}.tertiary-button .icon-gallery{font-size:0.625rem;margin-right:4px;}body{color:#818181;font-family:"mark-pro",arial,serif;font-size:1em;line-height:1.7;}h1,h2,h3,h4,h5,h6{margin:0;font-family:"mark-pro",arial,serif;line-height:1.33;font-weight:bold;}h1{font-size:1.875rem;}@media screen and (min-width: 1020px) {h1{font-size:3rem;}}h2{font-size:1.5rem;}@media screen and (min-width: 1020px) {h2{font-size:2.25rem;}}h3{font-size:1.375rem;}@media screen and (min-width: 1020px) {h3{font-size:1.75rem;}}h4{font-size:1.25rem;}@media screen and (min-width: 1020px) {h4{font-size:1.375rem;}}h5{font-size:1rem;}@media screen and (min-width: 1020px) {h5{font-size:1.125rem;}}h6{font-size:0.875rem;}p{margin:0;font-size:1rem;}a{color:#f99d1c;text-decoration:none;transition:color 250ms ease;}a:active,a:focus,a:hover{color:#f2612f;}ul,ol{margin:0;}blockquote{padding:20px 0;margin:30px 0;border-top:1px solid #79bde9;border-bottom:1px solid #79bde9;color:#1458a3;font-style:italic;font-size:1.5rem;line-height:1.3em;}@media screen and (min-width: 1020px) {blockquote{padding:30px 0;margin:40px 0;font-size:1.75rem;}}hr{margin:20px 0;border:none;border-top:1px solid #d6d6d6;}.content-container{padding-left:5%;padding-right:5%;padding-top:0px;padding-bottom:0px;max-width:1300px;margin-left:auto;margin-right:auto;}@media screen and (min-width: 720px) {.content-container{padding-left:30px;padding-right:30px;}}@media screen and (min-width: 1020px) {.content-container{padding-right:30px;padding-left:30px;}}@media screen and (min-width: 1340px) {.content-container{padding-right:0px;padding-left:0px;}}.wide-container{width:100%;max-width:1700px;margin:0 auto;}.single-column-content{max-width:850px;margin:0 auto;}.fade-container{position:relative;width:100%;max-width:1700px;margin:0 auto;}@media screen and (min-width: 1300px) {.fade-container:before,.fade-container:after{content:'';display:block;position:absolute;top:0;width:calc((100% - 1300px)/2); height: 100%; background: rgba(0, 0, 0, 0.4); z-index: 1; }.fade-container:before{left:0;background:linear-gradient(to left,rgba(255,255,255,0) 0%,#fff 200px);}.fade-container:after{right:0;background:linear-gradient(to right,rgba(255,255,255,0) 0%,#fff 200px);} } .stripe-section { padding: 15px 0; } @media screen and (min-width: 720px) { .stripe-section { padding: 25px 0; } } @media screen and (min-width: 1020px) { .stripe-section { padding: 40px 0; } } .stripe-section--has-pattern { position: relative; } .stripe-section--has-pattern .content-container { position: relative; z-index: 1; } .stripe-section__pattern { display: none; } @media screen and (min-width: 720px) { .stripe-section__pattern { display: block; position: absolute; bottom: -60px; left: 0; width: 100%; height: 120px; background-repeat: repeat-x; background-position: center; background-size: contain; z-index: -1; } } @media screen and (min-width: 1020px) { .stripe-section__pattern { bottom: -100px; height: 200px; } } @media screen and (min-width: 1340px) { .stripe-section__pattern { bottom: -160px; height: 320px; } } .site-header { border-bottom: 1px solid #d6d6d6; } .site-header .content-container { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; } @media screen and (min-width: 720px) { .site-header .content-container { align-items: flex-start; } } .site-header__logo { overflow: hidden; text-indent: 101%; white-space: nowrap; width: 150px; height: 44px; margin-top: 10px; margin-bottom: 10px; background: url(../img/water-org-logo.svg) no-repeat center; background-size: contain; } @media screen and (min-width: 720px) { .site-header__logo { width: 190px; height: 56px; margin-top: 70px; margin-bottom: 0; } } .site-header__mobile-menu-button { margin-left: auto; font-size: 1.875rem; color: #818181; cursor: pointer; } .site-header__mobile-menu-button:hover, .site-header__mobile-menu-button:focus { color: #79bde9; } @media screen and (min-width: 720px) { .site-header__mobile-menu-button { display: none; } } .site-header__navigation { display: none; position: absolute; top: 65px; left: 0; width: 100%; padding: 20px 5% 10px; background: #fff; border-bottom: 1px solid #d6d6d6; z-index: 10; } @media screen and (min-width: 720px) { .site-header__navigation { position: static; top: auto; left: auto; display: block; width: auto; padding: 0; margin-left: auto; border-bottom: none; } } .site-header__navigation ul { list-style: none; padding: 0; margin: 0; } @media screen and (min-width: 720px) { .site-header__utility-nav { margin: 16px 0 34px; text-align: right; } } .site-header__utility-nav ul { display: flex; flex-flow: column-reverse nowrap; } @media screen and (min-width: 720px) { .site-header__utility-nav ul { flex-direction: row; justify-content: flex-end; align-items: center; } } .site-header__utility-nav a { display: block; padding: 6px 0; font-family: "mark-pro-bold", arial, serif; color: #818181; } @media screen and (min-width: 720px) { .site-header__utility-nav a { color: #79bde9; font-size: 0.75rem; text-transform: uppercase; } } .site-header__utility-nav a:hover, .site-header__utility-nav a:focus { color: rgba(121, 189, 233, 0.7); } @media screen and (min-width: 720px) { .site-header__utility-nav-item + .site-header__utility-nav-item { margin-left: 24px; } } .site-header__utility-nav-item--is-search { width: 50%; margin-bottom: 20px; } @media screen and (min-width: 720px) { .site-header__utility-nav-item--is-search { width: auto; margin-bottom: 0; } } input[type="text"].site-header__search-field { margin-bottom: 0; font-size: 0.75rem; } .site-header__main-nav-item { border-top: 1px solid #d6d6d6; } @media screen and (min-width: 720px) { .site-header__main-nav-item { display: inline-block; border-top: none; } } @media screen and (min-width: 720px) { .site-header__main-nav-item + .site-header__main-nav-item { margin-left: 28px; } } @media screen and (min-width: 1020px) { .site-header__main-nav-item + .site-header__main-nav-item { margin-left: 40px; } } .site-header__main-nav-item a:not(.primary-button) { display: block; padding: 6px 0; } @media screen and (min-width: 720px) { .site-header__main-nav-item a:not(.primary-button) { display: inline; padding: 0; } } .site-header__main-nav-item > a:not(.primary-button) { color: #818181; font-family: "mark-pro-bold", arial, serif; } @media screen and (min-width: 720px) { .site-header__main-nav-item > a:not(.primary-button) { display: inline-block; padding-bottom: 34px; font-family: "mark-pro", arial, serif; } } .site-header__main-nav-item > a:not(.primary-button):hover, .site-header__main-nav-item > a:not(.primary-button):focus { color: #79bde9; } .site-header__main-nav-item--is-button { border-top: none; position: absolute; top: 14px; right: 5%; } @media screen and (min-width: 720px) { .site-header__main-nav-item--is-button { position: relative; top: auto; right: auto; } } @media screen and (min-width: 720px) { .site-header__main-nav-item--has-submenu:hover .site-header__submenu-container { opacity: 1; visibility: visible; z-index: 2; } } .site-header__submenu-container { display: none; width: 100%; padding-left: 3%; } @media screen and (min-width: 720px) { .site-header__submenu-container { padding-left: 5%; padding-right: 5%; padding-top: 0px; padding-bottom: 0px; display: flex; justify-content: center; position: absolute; left: 0; top: auto; padding-top: 44px; padding-bottom: 44px; background: #fff; border-top: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; opacity: 0; visibility: hidden; transition: opacity 0.3s linear; transition-delay: 0.2s; } } @media screen and (min-width: 720px) and (min-width: 720px) { .site-header__submenu-container { padding-left: 30px; padding-right: 30px; } } @media screen and (min-width: 720px) and (min-width: 1020px) { .site-header__submenu-container { padding-right: 30px; padding-left: 30px; } } @media screen and (min-width: 720px) and (min-width: 1340px) { .site-header__submenu-container { padding-right: 0px; padding-left: 0px; } } @media screen and (min-width: 1020px) { .site-header__submenu-container { padding-top: 56px; padding-bottom: 56px; } } @media screen and (min-width: 1700px) { .site-header__submenu-container { left: calc((100% - 1700px) / 2); width: 1700px; } } .site-header__submenu-container a { color: #818181; line-height: 2em; } .site-header__submenu-container a:hover, .site-header__submenu-container a:focus { color: #79bde9; } @media screen and (min-width: 720px) { .site-header__submenu + .site-header__submenu { padding-left: 35px; margin-left: 35px; border-left: 1px solid #d6d6d6; } } @media screen and (min-width: 1020px) { .site-header__submenu + .site-header__submenu { padding-left: 45px; margin-left: 45px; } } .site-header__submenu ul { display: none; } @media screen and (min-width: 720px) { .site-header__submenu ul { display: block; } } .site-header__submenu > li > a { font-family: "mark-pro-bold", arial, serif; } .site-header__submenu-column { display: inline-block; vertical-align: top; } .site-header__submenu-column + .site-header__submenu-column { margin-left: 50px; } @media screen and (min-width: 1020px) { .site-header__submenu-column + .site-header__submenu-column { margin-left: 90px; } } .site-header__submenu-column-header { margin: 10px 0; font-size: 0.75rem; color: #b9b9b9; } .site-header__submenu-column-header, .site-header__tertiary-menu { display: none; } @media screen and (min-width: 720px) { .site-header__submenu-column-header, .site-header__tertiary-menu { display: block; } } .page-header { position: relative; padding: 50px 0 80px; background-repeat: no-repeat; background-position: center; background-size: cover; color: #fff; } .page-header:after { content: ''; display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; background: rgba(0, 0, 0, 0.4); } @media screen and (min-width: 720px) { .page-header:after { background: linear-gradient(to right, rgba(0, 0, 0, 0.4) 0%, transparent 60%); } } @media screen and (min-width: 720px) { .page-header { padding: 90px 0 120px; } } @media screen and (min-width: 1020px) { .page-header { padding: 160px 0; } } .page-header .content-container { display: block; } .page-header .content-container::after { clear: both; content: ""; display: block; } .page-header__content { position: relative; z-index: 1; } @media screen and (min-width: 720px) { .page-header__content { float: left; display: block; margin-right: 2.35765%; width: 40.29137%; } .page-header__content:last-child { margin-right: 0; } } @media screen and (min-width: 1340px) { .page-header__content { float: left; display: block; margin-right: 2.35765%; width: 31.76157%; } .page-header__content:last-child { margin-right: 0; } } .page-header__headline + .page-header__body { margin-top: 16px; } .page-header__body { font-weight: bold; } .page-header__body + .primary-button { margin-top: 32px; } @media screen and (min-width: 720px) { .page-header__body + .primary-button { margin-top: 44px; } } .page-header__pattern { position: absolute; left: 0; bottom: 0; width: 100%; height: 40px; background-repeat: repeat-x; background-position: center top; background-size: 200%; z-index: 1; } @media screen and (min-width: 720px) { .page-header__pattern { height: 70px; background-size: auto; } } @media screen and (min-width: 1020px) { .page-header__pattern { height: 100px; } } @media screen and (max-width: 719px) { .template-homepage .page-header { background-size: 100%; background-position: center top; padding-top: 51vw; padding-bottom: 30px; margin-bottom: 10px; background-color: #fff; border-bottom: 1px solid #d6d6d6; color: #818181; } .template-homepage .page-header:after { display: none; } } @media screen and (max-width: 719px) { .template-homepage .page-header .content-container { padding-top: 20px; background: #fff; } } @media screen and (max-width: 719px) { .template-homepage .page-header__pattern { display: none; } } @media screen and (max-width: 719px) { .template-homepage .page-header__headline { color: #79bde9; } } .site-footer { background: #d6d6d6; } .site-footer__navigation { display: block; } .site-footer__navigation::after { clear: both; content: ""; display: block; } .site-footer__navigation ul { margin: 0; padding: 0; list-style: none; } @media screen and (min-width: 720px) { .site-footer__menu { float: left; display: block; margin-right: 2.35765%; width: 23.23176%; } .site-footer__menu:last-child { margin-right: 0; } .site-footer__menu:nth-child(4n) { margin-right: 0; } .site-footer__menu:nth-child(4n+1) { clear: left; } } @media screen and (min-width: 1020px) { .site-footer__menu { float: left; display: block; margin-right: 2.35765%; width: 14.70196%; } .site-footer__menu:last-child { margin-right: 0; } } .site-footer__menu + .site-footer__menu { margin-top: 20px; } @media screen and (min-width: 720px) { .site-footer__menu + .site-footer__menu { margin-top: 0; } } .site-footer__menu h6 { font-family: "mark-pro-bold", arial, serif; line-height: 1.7; } .site-footer__menu a { display: inline-block; padding: 6px 0; color: #818181; font-size: 0.875rem; } .site-footer__menu a:hover, .site-footer__menu a:focus { color: #79bde9; } @media screen and (min-width: 720px) { .site-footer__menu a { display: inline; padding: 0; } } .site-footer__social-menu { margin-top: 20px; } @media screen and (min-width: 720px) { .site-footer__social-menu { float: left; display: block; margin-right: 2.35765%; width: 100%; } .site-footer__social-menu:last-child { margin-right: 0; } } @media screen and (min-width: 1020px) { .site-footer__social-menu { float: right; width: auto; margin-top: 0; } } .site-footer__social-menu .secondary-button { display: inline-block; margin-top: 20px; } .site-footer__social-item { display: inline-block; font-size: 1.375rem; } .site-footer__social-item + .site-footer__social-item { margin-left: 14px; } .site-footer__social-item a { color: #818181; } .site-footer__social-item a:hover, .site-footer__social-item a:focus { color: #79bde9; } .site-footer__legal { font-size: 0.875rem; } @media screen and (min-width: 720px) { .site-footer__legal { display: flex; align-items: flex-end; justify-content: space-between; } } @media screen and (min-width: 720px) { .site-footer__legal { margin-top: 30px; } } @media screen and (min-width: 1020px) { .site-footer__legal { margin-top: 45px; } } .site-footer__logo { overflow: hidden; text-indent: 101%; white-space: nowrap; display: block; width: 190px; height: 56px; margin: 30px 0; background: url(../img/water-org-logo.svg) no-repeat center; background-size: contain; } @media screen and (min-width: 720px) { .site-footer__logo { margin: 0; } } .breadcrumbs-stripe { display: none; } @media screen and (min-width: 720px) { .breadcrumbs-stripe { display: block; padding-top: 30px; } } .breadcrumbs { padding: 0; margin: 0; line-height: 1em; } .breadcrumbs__item { display: inline-block; text-transform: uppercase; font-size: 0.75rem; font-weight: bold; } .breadcrumbs__item + .breadcrumbs__item:before { content: " > "; padding: 0 3px; color: #f99d1c; } .text-block h1, .text-block h2, .text-block h3, .text-block h4, .text-block h5, .text-block h6, .text-block--condensed h1, .text-block--condensed h2, .text-block--condensed h3, .text-block--condensed h4, .text-block--condensed h5, .text-block--condensed h6, .rich-text h1, .rich-text h2, .rich-text h3, .rich-text h4, .rich-text h5, .rich-text h6 { color: #79bde9; } .text-block, .rich-text { overflow: hidden; /*hr { margin: 20px 0; border: none; border-top: $base-border; }*/ } .text-block h1, .rich-text h1 { font-size: 1.5rem; } @media screen and (min-width: 1020px) { .text-block h1, .rich-text h1 { font-size: 2.25rem; } } .text-block ol, .text-block ul, .rich-text ol, .rich-text ul { padding-left: 20px; } @media screen and (min-width: 1020px) { .text-block ol, .text-block ul, .rich-text ol, .rich-text ul { padding-left: 40px; } } .text-block ol li, .text-block ul li, .rich-text ol li, .rich-text ul li { padding-left: 5px; } .text-block h1, .text-block h2, .text-block h3, .text-block h4, .text-block h5, .text-block h6, .rich-text h1, .rich-text h2, .rich-text h3, .rich-text h4, .rich-text h5, .rich-text h6 { margin-bottom: 16px; } .text-block p + p, .text-block p + ul, .text-block ul + p, .text-block p + ol, .text-block ol + p, .text-block * + h1, .text-block * + h2, .text-block * + h3, .text-block * + h4, .text-block * + h5, .text-block * + h6, .text-block * + form, .rich-text p + p, .rich-text p + ul, .rich-text ul + p, .rich-text p + ol, .rich-text ol + p, .rich-text * + h1, .rich-text * + h2, .rich-text * + h3, .rich-text * + h4, .rich-text * + h5, .rich-text * + h6, .rich-text * + form { margin-top: 20px; } .text-block .text-block__headline, .rich-text .text-block__headline { margin-bottom: 27px; } .text-block .block-infograph, .text-block .secondary-button, .rich-text .block-infograph, .rich-text .secondary-button { display: inline-block; margin-top: 16px; } @media screen and (min-width: 720px) { .text-block .block-infograph, .text-block .secondary-button, .rich-text .block-infograph, .rich-text .secondary-button { margin-top: 32px; } } .text-block .richtext-image.left, .rich-text .richtext-image.left { float: left; margin: 0 30px 30px 0; } .text-block .richtext-image.right, .rich-text .richtext-image.right { float: right; margin: 0 0 30px 30px; } .text-block .richtext-image.full-width, .rich-text .richtext-image.full-width { display: block; } .text-block--condensed p { font-size: 0.875rem; } .text-block--condensed .tertiary-button { margin-top: 16px; } .text-block--ruled { padding: 15px 0; border-top: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; } @media screen and (min-width: 720px) { .text-block--ruled { padding: 25px 0; } } @media screen and (min-width: 1020px) { .text-block--ruled { padding: 40px 0; } } .text-block.search-results h5 { margin-bottom: 8px; } .job-stats + .text-block, .form-text-block + .form-text-block { margin-top: 20px; } @media screen and (min-width: 1020px) { .job-stats + .text-block, .form-text-block + .form-text-block { margin-top: 40px; } } .form-text-block h5 { margin-bottom: 20px; } .summary-section .summary-section__content { max-width: 1500px; padding-left: 5%; padding-right: 5%; margin: 0 auto; } @media screen and (min-width: 720px) { .summary-section .summary-section__content { padding-left: 30px; padding-right: 30px; overflow: hidden; } } @media screen and (min-width: 1020px) { .summary-section .summary-section__content { display: flex; justify-content: space-between; padding: 0; overflow: visible; } } @media screen and (min-width: 720px) { .summary-section__text-block { float: left; width: 70%; } } @media screen and (min-width: 1020px) { .summary-section__text-block { flex-grow: 0; flex-shrink: 0; flex-basis: 50%; width: auto; margin: 0 auto; margin-bottom: 100px; padding: 0 40px; } } @media screen and (min-width: 1340px) { .summary-section__text-block { max-width: 670px; flex-basis: auto; } } .summary-section__image { margin-top: 30px; } @media screen and (min-width: 720px) { .summary-section__image { float: right; width: 25%; margin-top: 0; } } @media screen and (min-width: 1020px) { .summary-section__image { flex-grow: 0; flex-shrink: 1; } } .summary-section__image + .summary-section__image { margin-top: 30px; } @media screen and (min-width: 1020px) { .summary-section__image + .summary-section__image { margin-top: 0; } } .summary-section__image img { display: block; } @media screen and (min-width: 1020px) { .summary-section__image--left { order: -1; } } .summary-section__image--right { align-self: flex-end; } .featured-callout .content-container { display: flex; flex-flow: row wrap; margin: 0 auto; } @media screen and (min-width: 720px) { .featured-callout .content-container { overflow: hidden; flex-flow: row nowrap; align-items: center; justify-content: space-between; } } @media screen and (min-width: 1020px) { .featured-callout .content-container { justify-content: normal; overflow: visible; } } .featured-callout__image-container { position: relative; margin-top: 30px; } @media screen and (max-width: 719px) { .featured-callout__image-container { width: 100%; } } @media screen and (min-width: 720px) { .featured-callout__image-container { margin-top: 0; } } .featured-callout__image-container--left { order: 2; } @media screen and (min-width: 720px) { .featured-callout__image-container--left { margin-right: auto; order: 0; } } @media screen and (min-width: 720px) { .featured-callout__text-block, .featured-callout__image-container { width: 45%; } } .featured-callout__text-block .text-stat { margin-top: 16px; } @media screen and (min-width: 720px) { .featured-callout__text-block .text-stat { margin-top: 32px; } } .featured-callout__title { color: #1458a3; text-transform: uppercase; font-size: 0.75rem; font-family: "mark-pro-bold", arial, serif; } .featured-callout:not(.featured-callout--has-bubble) .content-container { max-width: 1500px; } @media screen and (min-width: 1020px) { .featured-callout:not(.featured-callout--has-bubble) .content-container { padding: 0; } } .featured-callout:not(.featured-callout--has-bubble) .featured-callout__image-container--right { margin-left: auto; } @media screen and (min-width: 720px) { .featured-callout:not(.featured-callout--has-bubble) .featured-callout__text-block { width: 46%; max-width: 630px; } } @media screen and (min-width: 1340px) { .featured-callout:not(.featured-callout--has-bubble) .featured-callout__text-block { width: 630px; } } @media screen and (min-width: 1020px) { .featured-callout:not(.featured-callout--has-bubble).featured-callout--image-right .featured-callout__text-block { margin-left: 30px; } } @media screen and (min-width: 1340px) { .featured-callout:not(.featured-callout--has-bubble).featured-callout--image-right .featured-callout__text-block { margin-left: calc((100vw - 1300px) / 2); } } @media screen and (min-width: 93.75rem) { .featured-callout:not(.featured-callout--has-bubble).featured-callout--image-right .featured-callout__text-block { margin-left: 100px; } } @media screen and (min-width: 1020px) { .featured-callout:not(.featured-callout--has-bubble).featured-callout--image-left .featured-callout__text-block { margin-left: auto; margin-right: 30px; } } @media screen and (min-width: 1340px) { .featured-callout:not(.featured-callout--has-bubble).featured-callout--image-left .featured-callout__text-block { margin-right: calc((100vw - 1300px) / 2); } } @media screen and (min-width: 93.75rem) { .featured-callout:not(.featured-callout--has-bubble).featured-callout--image-left .featured-callout__text-block { margin-right: 100px; } } @media screen and (min-width: 1020px) { .featured-callout--has-bubble .featured-callout__text-block, .featured-callout--has-bubble .featured-callout__image-container { width: 40%; margin-right: 10%; } } .featured-callout--has-bubble .featured-callout__image-container .bubble-stat { position: absolute; bottom: 40px; } @media screen and (min-width: 1020px) { .featured-callout--has-bubble .featured-callout__image-container .bubble-stat { bottom: 5vw; } } @media screen and (min-width: 1340px) { .featured-callout--has-bubble .featured-callout__image-container .bubble-stat { bottom: 140px; } } @media screen and (min-width: 720px) { .featured-callout--has-bubble .featured-callout__image-container--left { margin-right: auto; } } @media screen and (min-width: 1020px) { .featured-callout--has-bubble .featured-callout__image-container--left { margin-right: 10%; } } .featured-callout--has-bubble .featured-callout__image-container--left .bubble-stat { left: 20px; } @media screen and (min-width: 1020px) { .featured-callout--has-bubble .featured-callout__image-container--left .bubble-stat { left: -30px; } } @media screen and (min-width: 1340px) { .featured-callout--has-bubble .featured-callout__image-container--left .bubble-stat { left: -1.4vw; } } @media screen and (min-width: 1360px) { .featured-callout--has-bubble .featured-callout__image-container--left .bubble-stat { left: -30px; } } @media screen and (min-width: 1460px) { .featured-callout--has-bubble .featured-callout__image-container--left .bubble-stat { left: -80px; } } @media screen and (min-width: 720px) { .featured-callout--has-bubble .featured-callout__image-container--right { margin-left: auto; } } @media screen and (min-width: 1020px) { .featured-callout--has-bubble .featured-callout__image-container--right { margin-left: 0; } } .featured-callout--has-bubble .featured-callout__image-container--right .bubble-stat { right: 20px; } @media screen and (min-width: 1020px) { .featured-callout--has-bubble .featured-callout__image-container--right .bubble-stat { right: -11.5vw; } } @media screen and (min-width: 1340px) { .featured-callout--has-bubble .featured-callout__image-container--right .bubble-stat { right: -10vw; } } @media screen and (min-width: 1360px) { .featured-callout--has-bubble .featured-callout__image-container--right .bubble-stat { right: -145px; } } .bubble-stat { display: flex; align-items: center; justify-content: center; width: 250px; height: 267px; background: url(../img/bubble-stat-bg.png) no-repeat center; background-size: contain; } @media screen and (min-width: 1020px) { .bubble-stat { width: 336px; height: 359px; } } .bubble-stat__content { max-width: 100%; padding: 0 15%; color: #fff; text-align: center; } @media screen and (min-width: 1020px) { .bubble-stat__content { padding: 0 20%; } } .bubble-stat__number { display: block; padding-bottom: 5px; border-bottom: 1px solid #fff; font-family: "Univers49"; font-size: 4.375rem; line-height: 1em; } @media screen and (min-width: 1020px) { .bubble-stat__number { padding-bottom: 0; font-size: 7.8125rem; } } .bubble-stat__number + .bubble-stat__text { margin-top: 9px; } @media screen and (min-width: 1020px) { .bubble-stat__number + .bubble-stat__text { margin-top: 14px; } } .bubble-stat__text { font-size: 0.75rem; font-family: "mark-pro-bold", arial, serif; } @media screen and (min-width: 1020px) { .bubble-stat__text { font-size: 0.875rem; } } .text-stat { padding: 10px 0; } @media screen and (min-width: 720px) { .text-stat { display: flex; align-items: center; } } @media screen and (min-width: 1020px) { .text-stat { padding: 20px 0; } } .text-stat__number { display: block; font-family: "Univers49"; font-size: 4.375rem; line-height: 1em; color: #79bde9; } @media screen and (min-width: 720px) { .text-stat__number { display: inline-block; flex: 0 0 auto; padding-right: 20px; margin-right: 20px; border-right: 1px solid; } } @media screen and (min-width: 1020px) { .text-stat__number { padding-right: 30px; margin-right: 30px; font-size: 6.25rem; } } .text-block .text-stat__number { text-align: left; } .text-stat__text { font-size: 0.75rem; font-family: "mark-pro-bold", arial, serif; color: #1458a3; } @media screen and (min-width: 1020px) { .text-stat__text { font-size: 0.875rem; } } .stacked-stat__number { display: block; font-family: "Univers49"; font-size: 4.375rem; line-height: 1em; color: #79bde9; } @media screen and (min-width: 1020px) { .stacked-stat__number { font-size: 6.25rem; } } .stacked-stat__text { display: block; margin: 10px 0 20px; font-size: 0.75rem; font-family: "mark-pro-bold", arial, serif; color: #1458a3; } @media screen and (min-width: 1020px) { .stacked-stat__text { font-size: 0.875rem; } } .ruled-stats__item { padding: 10px 0; font-family: "mark-pro-bold", arial, serif; } .ruled-stats__item + .ruled-stats__item { border-top: 1px solid #d6d6d6; } .ruled-stats__item h1, .ruled-stats__item h2, .ruled-stats__item h3, .ruled-stats__item h4, .ruled-stats__item h5, .ruled-stats__item h6 { color: #79bde9; } .ruled-stats__item span { font-family: "mark-pro", arial, serif; } .ruled-stats__item p { font-size: 0.875rem; } .ruled-stats + .country-map { margin-top: 20px; } .featured-links .content-container { align-items: flex-start; } @media screen and (min-width: 1020px) { .template-homepage .featured-links .content-container { align-items: flex-end; } } @media screen and (min-width: 720px) { .featured-links__link-items { display: flex; flex-flow: row wrap; justify-content: space-between; } } .featured-links__link-items .text-block { width: 100%; } @media screen and (min-width: 720px) { .featured-links__link-item { flex: 0 0 46%; } } @media screen and (min-width: 1020px) { .featured-links__link-item { flex: 0 0 42%; } } .featured-links__link-item + .featured-links__link-item { margin-top: 20px; } @media screen and (min-width: 720px) { .featured-links__link-item + .featured-links__link-item { margin-top: 30px; } } @media screen and (min-width: 720px) { .template-homepage .featured-links__link-item + .featured-links__link-item { margin-top: 40px; } } @media screen and (min-width: 1020px) { .template-homepage .featured-links__link-item + .featured-links__link-item { margin-top: 44px; } } @media screen and (min-width: 720px) { .featured-links__link-item + .featured-links__link-item:nth-child(2) { margin-top: 0; } } .featured-links--has-bubble .featured-links__image { position: relative; } .featured-links--has-bubble .bubble-stat { position: relative; right: auto; width: 220px; height: 235px; margin: 0 auto; z-index: 2; } @media screen and (min-width: 720px) { .featured-links--has-bubble .bubble-stat { margin-top: -100px; } } @media screen and (min-width: 1020px) { .featured-links--has-bubble .bubble-stat { position: absolute; bottom: 0; width: 250px; height: 267px; margin: 0; } } @media screen and (min-width: 720px) { .featured-links--has-bubble .featured-links__image--left { margin-right: auto; } } @media screen and (min-width: 1020px) { .featured-links--has-bubble .featured-links__image--left { margin-right: 10%; } } @media screen and (min-width: 1020px) { .featured-links--has-bubble .featured-links__image--left .bubble-stat { left: -30px; } } @media screen and (min-width: 1340px) { .featured-links--has-bubble .featured-links__image--left .bubble-stat { left: -1.4vw; } } @media screen and (min-width: 1360px) { .featured-links--has-bubble .featured-links__image--left .bubble-stat { left: -30px; } } @media screen and (min-width: 1460px) { .featured-links--has-bubble .featured-links__image--left .bubble-stat { left: -80px; } } @media screen and (min-width: 720px) { .featured-links--has-bubble .featured-links__image--right { margin-left: auto; } } @media screen and (min-width: 1020px) { .featured-links--has-bubble .featured-links__image--right { margin-left: 0; } } @media screen and (min-width: 1020px) { .featured-links--has-bubble .featured-links__image--right .bubble-stat { right: -30px; } } @media screen and (min-width: 1340px) { .featured-links--has-bubble .featured-links__image--right .bubble-stat { right: -1.4vw; } } @media screen and (min-width: 1360px) { .featured-links--has-bubble .featured-links__image--right .bubble-stat { right: -30px; } } @media screen and (min-width: 1460px) { .featured-links--has-bubble .featured-links__image--right .bubble-stat { right: -80px; } } @media screen and (min-width: 720px) { .callout-halves .content-container { display: flex; } } @media screen and (min-width: 720px) { .callout-halves.staff-lists .content-container { justify-content: space-between; } } @media screen and (min-width: 720px) { .callout-halves__half { flex-basis: 47%; } .staff-lists .callout-halves__half { flex-basis: 48%; } } .callout-halves__half:nth-child(2n) { margin-top: 30px; } @media screen and (min-width: 720px) { .callout-halves__half:nth-child(2n) { border-left: 1px solid #d6d6d6; padding-left: 5%; margin-left: 5%; margin-top: 0; } .staff-lists .callout-halves__half:nth-child(2n) { border-left: 0; padding-left: 0; margin-left: 0; } } .bottom-image img { display: block; width: 100%; } .callout-stripe { width: 100%; padding: 20px 0; background: #79bde9; color: #fff; } @media screen and (min-width: 720px) { .callout-stripe { padding: 30px 0; } } .callout-stripe .content-container { text-align: center; } @media screen and (min-width: 720px) { .callout-stripe .content-container { display: flex; align-items: center; justify-content: center; text-align: left; } } @media screen and (min-width: 720px) { .callout-stripe__text { font-size: 1.125rem; } } .callout-stripe__button { margin-top: 10px; } @media screen and (min-width: 720px) { .callout-stripe__button { margin-top: 0; margin-left: 20px; } } .divided-content .content-container { display: flex; flex-flow: row wrap; } @media screen and (min-width: 720px) { .divided-content .content-container { justify-content: space-between; flex-flow: row nowrap; } } .divided-content--sidebar-first .divided-content__main { order: -1; } @media screen and (min-width: 720px) { .divided-content--sidebar-first .divided-content__main { order: 2; } } .divided-content__sidebar { flex-basis: 100%; margin-top: 20px; } @media screen and (min-width: 720px) { .divided-content__sidebar { flex-basis: 32%; margin-top: 0; } } @media screen and (min-width: 1020px) { .divided-content--condensed.divided-content--sidebar-first .divided-content__sidebar { flex-basis: 26%; margin-left: 6%; } } .divided-content__sidebar blockquote { padding: 0; margin: 0; border: none; } .divided-content__sidebar cite { display: block; margin-top: 20px; font-size: 1rem; line-height: 1.5em; } .divided-content__sidebar .cite__name { font-family: "mark-pro-bold", arial, serif; font-style: normal; } .divided-content__sidebar .cite__title { display: block; } .divided-content__main { flex-basis: 100%; } @media screen and (min-width: 720px) { .divided-content__main { flex-basis: 60%; } } @media screen and (min-width: 1020px) { .divided-content--condensed.divided-content--sidebar-first .divided-content__main { flex-basis: 54%; margin-right: 12%; } } .divided-content__main > * + * { margin-top: 20px; } .columned-content .content-container { display: flex; flex-flow: row wrap; } @media screen and (min-width: 720px) { .columned-content .content-container { justify-content: space-between; flex-flow: row nowrap; } } .columned-content__sidebar { width: 100%; margin-top: 30px; padding-top: 30px; border-top: 1px solid #d6d6d6; } @media screen and (min-width: 720px) { .columned-content__sidebar { /*flex-basis: 30%;*/ /*width: auto;*/ width: 30%; padding-top: 0; padding-left: 30px; margin-top: 0; border-top: none; border-left: 1px solid #d6d6d6; } } @media screen and (min-width: 1020px) { .columned-content__sidebar { /*flex-basis: 23%;*/ width: 23%; } } .columned-content__main { width: 100%; } @media screen and (min-width: 720px) { .columned-content__main { /*flex-basis: 66%;*/ width: 66%; } } @media screen and (min-width: 1020px) { .columned-content__main { /*flex-basis: 74%;*/ width: 74%; } } .links-list { display: flex; flex-flow: row wrap; justify-content: space-between; width: 100%; } .links-list .featured-links__link-item + .featured-links__link-item { margin-top: 30px; } @media screen and (min-width: 720px) { .links-list .featured-links__link-item + .featured-links__link-item:nth-child(2) { margin-top: 0; } } .text-block + .links-list, .links-list + .text-block { margin-top: 30px; } @media screen and (min-width: 720px) { .article-pods { display: flex; flex-flow: row wrap; justify-content: space-between; } } @media screen and (min-width: 1020px) { .article-pods { justify-content: initial; } } .article-pods + .article-pods { padding-top: 25px; margin-top: 25px; border-top: 1px solid #d6d6d6; } @media screen and (min-width: 1020px) { .article-pods + .article-pods { padding-top: 40px; margin-top: 40px; } } .article-pods__pod { flex: 0 0 48%; } @media screen and (min-width: 1020px) { .article-pods__pod { flex: 0 0 31%; } } .article-pods__pod + .article-pods__pod { margin-top: 30px; } @media screen and (min-width: 1020px) { .article-pods__pod + .article-pods__pod { margin-top: 56px; margin-left: 3.5%; } } @media screen and (min-width: 720px) { .article-pods__pod:nth-child(2) { margin-top: 0; } } @media screen and (min-width: 1020px) { .article-pods__pod:nth-child(3) { margin-top: 0; } } @media screen and (min-width: 1020px) { .article-pods__pod:nth-child(3n + 1) { margin-left: 0; } } .article-pods__image { margin-bottom: 16px; } .text-block + .article-pods { margin-top: 30px; } @media screen and (min-width: 720px) { .text-block + .article-pods { margin-top: 40px; } } @media screen and (min-width: 1020px) { .text-block + .article-pods { margin-top: 44px; } } .partner-pods__image { height: 100px; display: flex; align-items: center; justify-content: center; } .partner-pods__image img { max-height: 100%; } @media screen and (min-width: 720px) { .partner-pods .article-pods__pod:nth-child(2n+1) { position: relative; } .partner-pods .article-pods__pod:nth-child(2n+1):before { content: ''; position: absolute; top: 0; left: 0; width: 209%; height: 1px; border-top: 1px solid #d6d6d6; } } @media screen and (min-width: 1020px) { .partner-pods .article-pods__pod:nth-child(2n+1):before { display: none; } } @media screen and (min-width: 1020px) { .partner-pods .article-pods__pod:nth-child(3n+1) { position: relative; } .partner-pods .article-pods__pod:nth-child(3n+1):before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 324%; height: 1px; border-top: 1px solid #d6d6d6; } } .partner-pods .article-pods__pod:nth-child(1):before { display: none; } @media screen and (min-width: 720px) { .partner-pods .article-pods__pod + .article-pods__pod { padding-top: 30px; } .partner-pods .article-pods__pod + .article-pods__pod:nth-child(2) { padding-top: 0; } } @media screen and (min-width: 1020px) { .partner-pods .article-pods__pod + .article-pods__pod { padding-top: 56px; } .partner-pods .article-pods__pod + .article-pods__pod:nth-child(3) { padding-top: 0; } } a.sidebar-nav__link { display: block; padding: 4px 0; color: #818181; } a.sidebar-nav__link:hover, a.sidebar-nav__link:focus { color: #79bde9; } .sidebar-nav__link--current { font-family: "mark-pro-bold", arial, serif; } .sidebar-nav__label { display: block; padding: 6px 0; font-size: 0.75rem; color: #b9b9b9; } .sidebar-nav__title { color: #79bde9; } .sidebar-stats .stacked-stat + .ruled-stats { margin-top: 20px; } @media screen and (min-width: 720px) { .sidebar-stats .stacked-stat + .ruled-stats { margin-top: 30px; } } .sidebar-stats .stacked-stat { border-bottom: 1px solid #d6d6d6; } .sidebar-section + .sidebar-section { margin-top: 30px; } .sidebar-section .sidebar-featured-links__link-item + .sidebar-featured-links__link-item { margin-top: 20px; } @media screen and (min-width: 720px) { .sidebar-section .sidebar-featured-links__link-item + .sidebar-featured-links__link-item { margin-top: 30px; } } .sidebar-section blockquote { padding: 0; margin: 0; border: none; } .sidebar-section cite { display: block; margin-top: 20px; font-size: 1rem; line-height: 1.5em; } .sidebar-section .cite__name { font-family: "mark-pro-bold", arial, serif; font-style: normal; } .sidebar-section .cite__title { display: block; } .sidebar-section--ruled { padding-top: 30px; border-top: 1px solid #d6d6d6; } .cta-callout__intro p { font-size: 1rem; } @media screen and (min-width: 1020px) { .cta-callout__intro p { font-size: 1.125rem; } } .cta-callout__intro + .cta-callout__button { margin-top: 10px; } .article-header + .article-body { margin-top: 30px; } @media screen and (min-width: 720px) { .article-header + .article-body { margin-top: 44px; } } .article-main + .article-footer { padding-top: 30px; margin-top: 30px; border-top: 1px solid #d6d6d6; } @media screen and (min-width: 720px) { .article-main + .article-footer { padding-top: 44px; margin-top: 44px; } } @media screen and (min-width: 1020px) { .article-body { display: flex; justify-content: space-between; } } @media screen and (min-width: 1340px) { .article-body { justify-content: flex-start; } } .article-body__share { margin-top: 20px; } @media screen and (min-width: 1020px) { .article-body__share { order: -1; flex: 0 0 12%; max-width: 95px; margin-top: 65px; } } @media screen and (min-width: 1340px) { .article-body__share { max-width: 100%; } } .article-body__share-trigger { display: inline-block; } .article-body__share-list { display: none; padding: 0px; list-style: none; } .article-body__share-item { display: inline-block; margin-right: 15px; font-size: 1.5rem; } @media screen and (min-width: 1020px) { .article-body__share-item { display: block; margin-right: 0; margin-top: 5px; } } .article-body__title { padding-bottom: 16px; border-bottom: 1px solid #d6d6d6; } @media screen and (min-width: 720px) { .article-body__title { padding-bottom: 24px; } } .text-block .article-body__title { margin-bottom: 24px; } @media screen and (min-width: 720px) { .text-block .article-body__title { margin-bottom: 34px; } } .article-body__title-modifier { display: block; font-size: 0.875rem; color: #818181; } @media screen and (min-width: 720px) { .article-body__title-modifier { display: inline-block; margin-left: 20px; } } @media screen and (min-width: 1020px) { .article-body__text { flex: 0 0 84%; } } @media screen and (min-width: 1340px) { .article-body__text { max-width: 750px; margin-left: 4%; } } @media screen and (min-width: 1020px) { .staff-bio .article-body__text { flex: 0 0 100%; max-width: 750px; margin: 0 auto; } } @media screen and (min-width: 1020px) { .article-main--has-share + .article-footer { width: 84%; margin-left: auto; } } @media screen and (min-width: 1340px) { .article-main--has-share + .article-footer { max-width: 750px; margin-left: 16%; } } .article-figure { margin: 20px 0; } @media screen and (min-width: 1020px) { .article-figure { margin: 30px 0; } } .article-figure__image { display: block; } .article-figure__caption { border-bottom: 1px solid #d6d6d6; font-size: 0.875rem; font-style: italic; padding: 10px 0; } .article-gallery { margin: 20px 0; } @media screen and (min-width: 1020px) { .article-gallery { max-width: 70%; margin: 30px 0; } } .quarters-content .article-gallery { margin: 0; } @media screen and (min-width: 1020px) { .quarters-content .article-gallery { max-width: 100%; } } .featured-callout .article-gallery { margin: 0; } @media screen and (min-width: 1020px) { .featured-callout .article-gallery { max-width: 100%; margin: 0; } } .article-gallery__list { display: none; } .article-gallery__preview { border-bottom: 1px solid #d6d6d6; } .quarters-content .article-gallery__preview { border-bottom: 0; } .article-gallery__preview-image { position: relative; } .article-gallery__preview-image img { display: block; } .article-gallery__preview-caption { padding: 10px 0; font-size: 0.875rem; font-style: italic; } .article-gallery__trigger { position: absolute; bottom: 10px; left: 10px; } /* Magnific Popup CSS */ .mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.9; } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 8px; box-sizing: border-box; } .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader { color: #fff; position: absolute; top: 50%; width: auto; text-align: center; margin-top: -0.8em; left: 8px; right: 8px; z-index: 1044; } .mfp-preloader a { color: #fff; } .mfp-preloader a:hover { color: #FFF; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; display: block; outline: none; padding: 0; z-index: 1046; box-shadow: none; touch-action: manipulation; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { width: 44px; height: 44px; line-height: 44px; position: absolute; right: 0; top: 10px; text-decoration: none; text-align: center; opacity: 0.65; padding: 0 0 18px 10px; color: #FFF; font-style: normal; font-size: 1.5rem; font-family: Arial, Baskerville, monospace; transition: opacity 250ms ease; /*&:active { top: 1px; }*/ } .mfp-close:hover, .mfp-close:focus { opacity: 1; } .mfp-close-btn-in .mfp-close { color: #333; } .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { color: #FFF; right: -6px; text-align: right; padding-right: 6px; width: 100%; } .mfp-counter { position: absolute; top: 0; right: 0; color: #fff; font-size: 12px; line-height: 18px; white-space: nowrap; } .mfp-arrow { position: absolute; opacity: 0.65; margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; color: #fff; font-size: 1.875rem; text-shadow: 0 0 7px rgba(0, 0, 0, 0.7); transition: opacity 250ms ease; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; } .mfp-arrow-left { left: 0; } .mfp-arrow-right { right: 0; } /* // Navigation arrows @if $mfp-include-arrows { .mfp-arrow { position: absolute; opacity: $mfp-controls-opacity; margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; -webkit-tap-highlight-color: rgba(0,0,0,0); &:active { margin-top: -54px; } &:hover, &:focus { opacity: 1; } &:before, &:after { content: ''; display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } &:after { border-top-width: 13px; border-bottom-width: 13px; top:8px; } &:before { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } } .mfp-arrow-left { left: 0; &:after { border-right: 17px solid $mfp-controls-color; margin-left: 31px; } &:before { margin-left: 25px; border-right: 27px solid $mfp-controls-border-color; } } .mfp-arrow-right { right: 0; &:after { border-left: 17px solid $mfp-controls-color; margin-left: 39px } &:before { border-left: 27px solid $mfp-controls-border-color; } } } */ .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 900px; } .mfp-iframe-holder .mfp-close { top: -40px; } .mfp-iframe-scaler { width: 100%; height: 0; overflow: hidden; padding-top: 56.25%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #000; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; box-sizing: border-box; padding: 60px 0 80px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 60px; bottom: 80px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444; } .mfp-figure small { color: #BDBDBD; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -66px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { text-align: left; line-height: 18px; color: #fff; font-size: 0.875rem; font-style: italic; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** * Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; box-sizing: border-box; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; background: rgba(0, 0, 0, 0.6); position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { -webkit-transform: scale(0.75); transform: scale(0.75); } .mfp-arrow-left { -webkit-transform-origin: 0; transform-origin: 0; } .mfp-arrow-right { -webkit-transform-origin: 100%; transform-origin: 100%; } .mfp-container { padding-left: 6px; padding-right: 6px; } } /* ==================================================================================================================== * RESETS * ====================================================================================================================*/ .flex-container a:hover, .flex-slider a:hover { outline: none; } .slides, .slides > li, .flex-control-nav, .flex-direction-nav { margin: 0; padding: 0; list-style: none; } .flex-pauseplay span { text-transform: capitalize; } /* ==================================================================================================================== * BASE STYLES * ====================================================================================================================*/ .flexslider { margin: 0; padding: 0; } .flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; } .flexslider .slides img { width: 100%; display: block; } .flexslider .slides:after { content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } html[xmlns] .flexslider .slides { display: block; } * html .flexslider .slides { height: 1%; } .no-js .flexslider .slides > li:first-child { display: block; } /* ==================================================================================================================== * RESPONSIVE * ====================================================================================================================*/ @media screen and (max-width: 860px) { .flex-direction-nav .flex-prev { opacity: 1; left: 10px; } .flex-direction-nav .flex-next { opacity: 1; right: 10px; } } .general-slider { position: relative; } @media screen and (min-width: 720px) { .general-slide { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; max-width: 84%; padding-top: 24px; margin: 0 auto; } } @media screen and (min-width: 1020px) { .general-slide { padding-top: 0; } } @media screen and (min-width: 720px) { .general-slide__text, .general-slide__image { flex: 0 0 47%; } } @media screen and (min-width: 1340px) { .general-slide__text, .general-slide__image { flex: 0 0 45%; } } .general-slide__image { display: none; } .general-slider--timeline .general-slide__image { margin-top: 20px; } @media screen and (min-width: 720px) { .general-slider--timeline .general-slide__image { margin-top: 0; } } @media screen and (min-width: 720px) { .general-slide__image { display: block; } } .general-slider .flex-control-nav { display: none; } @media screen and (min-width: 720px) { .general-slider .flex-control-nav { display: block; position: absolute; top: 0; left: 8%; z-index: 2; } } .general-slider .flex-control-nav li { display: inline-block; } .general-slider .flex-control-nav li + li { margin-left: 12px; } .general-slider .flex-control-nav a { overflow: hidden; text-indent: 101%; white-space: nowrap; display: inline-block; width: 12px; height: 12px; background: #79bde9; border-radius: 50%; opacity: .3; } .general-slider .flex-control-nav a.flex-active { opacity: 1; } .general-slider .flex-nav-prev, .general-slider .flex-nav-next { display: none; } @media screen and (min-width: 720px) { .general-slider .flex-nav-prev, .general-slider .flex-nav-next { display: block; font-size: 2.5rem; position: absolute; top: calc(50% - 30px); z-index: 2; } } @media screen and (min-width: 1020px) { .general-slider .flex-nav-prev, .general-slider .flex-nav-next { font-size: 3.75rem; } } .general-slider .flex-nav-prev a, .general-slider .flex-nav-next a { color: #d6d6d6; } .general-slider .flex-nav-prev a:hover, .general-slider .flex-nav-next a:hover { color: #79bde9; } .general-slider .flex-nav-prev { left: 0; } .general-slider .flex-nav-next { right: 0; } @media screen and (max-width: 719px) { .general-slider--timeline .slides > li { display: block; } .general-slider--timeline .slides > li + li { margin-top: 34px; } } .general-slider--timeline .general-slide__image { display: block; } @media screen and (min-width: 720px) { .general-slide__bubble { display: flex; align-items: center; justify-content: center; position: absolute; left: 50%; bottom: 0; width: 19.2vw; height: 20.5vw; max-width: 250px; max-height: 267px; background: url(../img/bubble-stat-bg.png) no-repeat center; background-size: contain; } } @media screen and (min-width: 1020px) { .general-slide__bubble { bottom: -40px; } } .general-slide__bubble-content { color: #1458a3; font-family: "Univers49"; font-size: 3.125rem; } @media screen and (min-width: 720px) { .general-slide__bubble-content { text-align: center; color: #fff; font-size: 9vw; line-height: 1em; } } @media screen and (min-width: 1340px) { .general-slide__bubble-content { font-size: 7.5rem; } } @media screen and (min-width: 720px) { .map-stats { width: 166%; margin-left: -66%; } } @media screen and (min-width: 1020px) { .map-stats { width: 110%; margin-left: -5%; } } @media screen and (min-width: 1020px) { .map-stats__map { width: 110%; } } .map-stats__stats { position: relative; overflow: hidden; } @media screen and (min-width: 720px) { .map-stats__stats { margin-top: -50px; } } @media screen and (min-width: 1020px) { .map-stats__stats { width: 105%; } } @media screen and (min-width: 720px) { .map-stats__stat { width: 47%; float: left; } } @media screen and (min-width: 720px) { .map-stats__stat + .map-stats__stat { margin-left: 5%; } } .map-stats__stat .bubble-stat { max-width: 100%; } @media screen and (min-width: 720px) { .map-stats__stat .bubble-stat { margin: 0 auto; } } .text-block + .map-stats { margin-top: 20px; } @media screen and (min-width: 720px) { .text-block + .map-stats { margin-top: 30px; } } .references-text { font-size: 0.875rem; } .references-text h1, .references-text h2, .references-text h3, .references-text h4, .references-text h5, .references-text h6 { font-size: 0.875rem; } .references-text ul { list-style: none; padding: 0; font-style: italic; } .references-text a { font-weight: bold; } .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .article-body .embed-container { margin: 20px 0; } @media screen and (min-width: 1020px) { .article-body .embed-container { margin: 30px 0; } } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .pagination { display: flex; justify-content: space-between; padding-top: 15px; } @media screen and (min-width: 720px) { .pagination { padding-top: 25px; } } @media screen and (min-width: 1020px) { .pagination { padding-top: 40px; } } .pagination__item { min-width: 50px; line-height: 20px; } .pagination__next-link { text-align: right; } .pagination__page-count { padding-top: 2px; font-size: 0.75rem; text-transform: uppercase; text-align: center; } .info-graph { padding: 0; } @media screen and (min-width: 720px) { .info-graph { display: flex; flex-flow: row wrap; } } .info-graph__item { list-style: none; } @media screen and (min-width: 720px) { .info-graph__item { flex: 0 0 140px; position: relative; padding-top: 10px; margin-right: 40px; } } @media screen and (min-width: 1020px) { .info-graph__item { flex: 0 0 180px; margin-right: 60px; } } @media screen and (min-width: 720px) { .info-graph__item:after { content: "\e905"; display: block; position: absolute; top: 60px; left: calc(100% + 10px); font-family: 'icomoon' !important; font-size: 1.375rem; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; color: #d6d6d6; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } } @media screen and (min-width: 1020px) { .info-graph__item:after { top: 80px; left: calc(100% + 17px); font-size: 1.875rem; } } @media screen and (min-width: 720px) { .info-graph__item:last-child { margin-right: 0; } .info-graph__item:last-child:after { content: none; } } .info-graph__item + .info-graph__item { margin-top: 20px; } @media screen and (min-width: 720px) { .info-graph__item + .info-graph__item { margin-top: 0; } } .info-graph__image { display: block; max-width: 110px; margin: 0 auto 10px; } @media screen and (min-width: 1020px) { .info-graph__image { max-width: 150px; } } .info-graph__caption { font-size: 0.75rem; font-family: "mark-pro-bold", arial, serif; color: #1458a3; text-align: center; } @media screen and (min-width: 1020px) { .info-graph__caption { font-size: 0.875rem; } } .chart-stat { padding: 10px 0; } @media screen and (min-width: 1020px) { .chart-stat { padding: 20px 0; } } .stat-columns__column .chart-stat { display: flex; flex-flow: column nowrap; justify-content: flex-start; height: 100%; } @media screen and (min-width: 720px) { .chart-stat__body { display: flex; align-items: center; } .stat-columns__column .chart-stat__body { flex-grow: 1; min-height: 1px; } } .chart-stat__header { margin-bottom: 16px; } .chart-stat__chart { display: block; } @media screen and (min-width: 720px) { .chart-stat__chart { display: inline-block; flex: 0 1 auto; padding-right: 20px; margin-right: 20px; border-right: 1px solid #79bde9; } } @media screen and (min-width: 1020px) { .chart-stat__chart { padding-right: 30px; margin-right: 30px; } } .chart-stat__chart img { display: block; } @media screen and (min-width: 720px) { .chart-stat__chart img { width: 100%; } } .chart-stat__title, .chart-stat__text { font-size: 0.75rem; font-family: "mark-pro-bold", arial, serif; color: #1458a3; } @media screen and (min-width: 1020px) { .chart-stat__title, .chart-stat__text { font-size: 0.875rem; } } .chart-stat__key { padding: 0; margin-top: 16px; list-style: none; font-family: "mark-pro", arial, serif; } @media screen and (min-width: 720px) { .chart-stat__key { margin-top: 0; } } .chart-stat__key-color { display: inline-block; width: 9px; height: 9px; margin-right: 5px; border-radius: 50%; } .chart-stat__key-number { font-family: "mark-pro-bold", arial, serif; } @media screen and (min-width: 1020px) { .text-callouts { display: flex; flex-flow: row wrap; justify-content: space-between; } } @media screen and (min-width: 1020px) { .text-callout { flex: 0 0 48%; } } .text-callout + .text-callout { margin-top: 25px; } @media screen and (min-width: 1020px) { .text-callout + .text-callout { margin-top: 40px; } .text-callout + .text-callout:nth-child(2) { margin-top: 0; } } .text-callout .secondary-button { display: inline-block; margin-top: 16px; } .text-callout__headline { margin-bottom: 16px; color: #79bde9; } .text-callout__image { margin-bottom: 16px; } .text-block + .text-callouts { margin-top: 15px; } @media screen and (min-width: 720px) { .text-block + .text-callouts { margin-top: 25px; } } @media screen and (min-width: 1020px) { .text-block + .text-callouts { margin-top: 40px; } } .stat-columns { padding: 15px 0; margin: 15px 0; border-top: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; } @media screen and (min-width: 720px) { .stat-columns { padding: 30px 0; margin: 30px 0; } } @media screen and (min-width: 1020px) { .stat-columns { /*display: flex; justify-content: space-between;*/ overflow: hidden; } } @media screen and (min-width: 1020px) { .stat-columns__column { /*flex: 0 0 45%;*/ width: 45%; float: right; } } @media screen and (min-width: 1020px) { .stat-columns__column:first-child { /*flex: 0 0 50%;*/ width: 50%; float: left; padding-right: 5%; border-right: 1px solid #d6d6d6; } } .stat-columns__column + .stat-columns__column { margin-top: 30px; } @media screen and (min-width: 1020px) { .stat-columns__column + .stat-columns__column { margin-top: 0; } } .stat-columns__column .text-stat, .stat-columns__column .chart-stat { padding: 0; } @media screen and (min-width: 720px) { .link-columns { display: flex; justify-content: space-between; align-items: flex-start; } } @media screen and (min-width: 720px) { .link-columns__column { flex: 0 0 30%; } } .link-columns__column + .link-columns__column { margin-top: 30px; } @media screen and (min-width: 720px) { .link-columns__column + .link-columns__column { margin-top: 0; } } .link-columns__links { padding: 0; list-style: none; display: flex; flex-flow: row wrap; align-items: flex-start; } .link-columns__title { color: #79bde9; } .link-columns__title + .link-columns__links { margin-top: 10px; } .link-columns__link-item { flex: 0 0 30%; padding: 5px 0; font-weight: bold; } @media screen and (min-width: 720px) { .link-columns__link-item { flex: 0 0 46%; } } @media screen and (min-width: 1020px) { .link-columns__link-item { flex: 0 0 30%; } } .rich-text + .link-columns { padding-top: 15px; margin-top: 15px; border-top: 1px solid #d6d6d6; /*border-bottom: $base-border;*/ } @media screen and (min-width: 720px) { .rich-text + .link-columns { padding-top: 25px; margin-top: 25px; } } @media screen and (min-width: 1020px) { .rich-text + .link-columns { padding-top: 40px; margin-top: 40px; } } .quarters-content .content-container { display: flex; flex-flow: row wrap; } @media screen and (min-width: 720px) { .quarters-content .content-container { justify-content: space-between; /*flex-flow: row nowrap;*/ } } .quarters-content--sidebar-first .quarters-content__main { order: -1; } @media screen and (min-width: 720px) { .quarters-content--sidebar-first .quarters-content__main { order: 2; } } .quarters-content__main, .quarters-content__quarter, .quarters-content__sidebar { flex-basis: 100%; } @media screen and (min-width: 720px) { .quarters-content__quarter { flex-basis: 47%; margin-top: 0; } } @media screen and (min-width: 1020px) { .quarters-content__quarter { flex-basis: 23%; } } @media screen and (min-width: 720px) { .quarters-content__sidebar { flex-basis: 33%; margin-top: 0; } } @media screen and (min-width: 1020px) { .quarters-content__sidebar { flex-basis: 23%; } } @media screen and (min-width: 720px) { .quarters-content__main { flex-basis: 64%; } } @media screen and (min-width: 1020px) { .quarters-content__main { flex-basis: 74%; } } @media screen and (min-width: 720px) { .quarters-content__main.quarters-content__main--solo { flex-basis: 100%; } } @media screen and (min-width: 1020px) { .quarters-content__main.quarters-content__main--solo { flex-basis: 74%; } } .quarters-content__main > * + * { margin-top: 20px; } .quarters-content__quarter + .quarters-content__quarter, .quarters-content__main + .quarters-content__sidebar { margin-top: 20px; } @media screen and (min-width: 720px) { .quarters-content__quarter + .quarters-content__quarter:nth-child(2) { margin-top: 0; } } @media screen and (min-width: 1020px) { .quarters-content__quarter + .quarters-content__quarter { margin-top: 0; } } @media screen and (min-width: 720px) { .quarters-content__main + .quarters-content__sidebar { margin-top: 0; } } .ruled-list { padding: 0; } .ruled-list__item { padding: 10px 0; border-top: 1px solid #d6d6d6; -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; list-style: none; } .ruled-list__item.columned-list__item:first-child { border-top: none; } @media screen and (min-width: 720px) { .ruled-list__item.columned-list__item:nth-child(2) { border-top: none; } } @media screen and (min-width: 720px) { .columned-list { display: flex; flex-flow: row wrap; justify-content: space-between; } } @media screen and (min-width: 720px) { .columned-list__item { flex-basis: 48%; } } .staff-lists, .staff-list + .staff-list { margin-top: 30px; } .staff-list__title { margin-bottom: 16px; color: #79bde9; text-transform: uppercase; } .staff-list__headline { font-family: "mark-pro-bold", arial, serif; } .wide-container > .block-html, .wide-container > .block-rich_text, .wide-container > .block-block_quote, .wide-container > .block-cta_link { padding-left: 5%; padding-right: 5%; padding-top: 0px; padding-bottom: 0px; max-width: 1300px; margin-left: auto; margin-right: auto; padding: 15px 5%; } @media screen and (min-width: 720px) { .wide-container > .block-html, .wide-container > .block-rich_text, .wide-container > .block-block_quote, .wide-container > .block-cta_link { padding-left: 30px; padding-right: 30px; } } @media screen and (min-width: 1020px) { .wide-container > .block-html, .wide-container > .block-rich_text, .wide-container > .block-block_quote, .wide-container > .block-cta_link { padding-right: 30px; padding-left: 30px; } } @media screen and (min-width: 1340px) { .wide-container > .block-html, .wide-container > .block-rich_text, .wide-container > .block-block_quote, .wide-container > .block-cta_link { padding-right: 0px; padding-left: 0px; } } @media screen and (min-width: 720px) { .wide-container > .block-html, .wide-container > .block-rich_text, .wide-container > .block-block_quote, .wide-container > .block-cta_link { padding: 25px 30px; } } @media screen and (min-width: 1020px) { .wide-container > .block-html, .wide-container > .block-rich_text, .wide-container > .block-block_quote, .wide-container > .block-cta_link { padding: 40px 30px; } } @media screen and (min-width: 1340px) { .wide-container > .block-html, .wide-container > .block-rich_text, .wide-container > .block-block_quote, .wide-container > .block-cta_link { padding-right: 0px; padding-left: 0px; } } .wide-container > .block-rich_text { max-width: 1024px; } .wide-container > .block-rich_text + .block-cta_link { max-width: 1024px; padding-top: 0; } @media screen and (min-width: 1020px) { .wide-container > .block-rich_text + .block-cta_link { margin-top: -10px; } } .columned-callouts__headline { border-bottom: 1px solid #d6d6d6; padding-bottom: 24px; margin-bottom: 24px; text-align: center; color: #79bde9; } @media screen and (min-width: 720px) { .columned-callouts__columns { display: flex; flex-flow: row nowrap; justify-content: space-between; } } .columned-callouts__column { flex: 1; } .columned-callouts__column + .columned-callouts__column { margin-top: 30px; } @media screen and (min-width: 720px) { .columned-callouts__column + .columned-callouts__column { margin-top: 0; margin-left: 40px; } } .donate-content .block-rich_text + .block-html { padding-top: 25px; margin-top: 25px; border-top: 1px solid #d6d6d6; } @media screen and (min-width: 720px) { .donate-content .block-rich_text + .block-html { padding-top: 40px; margin-top: 40px; } } .donate-content__stats { margin: 20px 0; } @media screen and (min-width: 720px) { .donate-content__stats { margin: 40px 0; } } .donate-content__stats strong { font-family: "mark-pro-bold", arial, serif; font-weight: normal; } @media screen and (min-width: 720px) { .donate-content__stats strong { display: inline-block; width: 200px; } } .donate-content__footer { margin-top: 20px; } .donate-content__footer ul { padding: 0; list-style: none; } .donate-content__footer li { display: inline-block; } .donate-callouts .block-html { margin-left: 20px; } @media screen and (min-width: 720px) { .donate-callouts .block-html { margin-left: 40px; } } .donate-callouts li + li { margin-top: 10px; } @media screen and (min-width: 720px) { .stripe-stats .content-container { display: flex; justify-content: space-between; flex-flow: row nowrap; } } @media screen and (min-width: 720px) { .stripe-stats .text-stat { flex: 1; padding: 0 3%; } .stripe-stats .text-stat:first-child { padding-left: 0; } .stripe-stats .text-stat:last-child { padding-right: 0; } } .bleeding-image { position: relative; } @media screen and (max-width: 719px) { .bleeding-image { background: none !important; } .bleeding-image .page-header__pattern { display: none; } } @media screen and (min-width: 720px) { .bleeding-image { min-height: 59vw; background-repeat: no-repeat; background-size: 1020px; background-position: center bottom; } } @media screen and (min-width: 1020px) { .bleeding-image { background-size: contain; } } @media screen and (min-width: 1700px) { .bleeding-image { min-height: 0; height: 1000px; } } @media screen and (min-width: 720px) { .bleeding-image__text { width: 58%; padding-bottom: 420px; } } @media screen and (min-width: 1020px) { .bleeding-image__text { width: 45%; /*padding-bottom: 420px;*/ } } @media screen and (min-width: 1340px) { .bleeding-image__text { padding-bottom: 580px; } } .confirmation__content { max-width: 960px; margin: 0 auto; } .text-block + .confirmation__stats { margin-top: 25px; } @media screen and (min-width: 1020px) { .text-block + .confirmation__stats { margin-top: 40px; } } .confirmation__stat-title { margin-right: 20px; } .confirmation__stat-value { font-family: "mark-pro-bold", arial, serif; } .shaded-callout { padding: 30px 25px; background: rgba(121, 189, 233, 0.25); } .confirmation__stats + .shaded-callout { margin-top: 25px; } @media screen and (min-width: 1020px) { .confirmation__stats + .shaded-callout { margin-top: 40px; } } .form__title { color: #79bde9; } .form__title, form + .form__footer { margin-top: 30px; } /*** Donate.ly embed form ***/ fieldset[for=honorees_name], fieldset[for=honorees_email], fieldset[for=honorees_subject], fieldset[for=honorees_message] { display: none; } .donately-form { position: relative; z-index: 1; } ul.career-listings { padding: 0; list-style: none; } ul.career-listings li { padding-left: 0; } /*** Fields ***/ /* * Wagtail responsive embeds * http://docs.wagtail.io/en/v1.5.3/topics/writing_templates.html#responsive-embeds */ .rich-text img { max-width: 100%; height: auto; } .responsive-object { position: relative; } .responsive-object iframe, .responsive-object object, .responsive-object embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /*# sourceMappingURL=water_org.css.map */