@font-face { font-family: 'hk_groteskregular'; src: url("/assets/fonts/hkgrotesk-regular-webfont.woff2") format("woff2"), url("/assets/fonts/hkgrotesk-regular-webfont.woff") format("woff"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'hk_grotesklight'; src: url("/assets/fonts/hkgrotesk-light-webfont.woff2") format("woff2"), url("/assets/fonts/hkgrotesk-light-webfont.woff") format("woff"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'hk_grotesksemibold'; src: url("/assets/fonts/hkgrotesk-semibold-webfont.woff2") format("woff2"), url("/assets/fonts/hkgrotesk-semibold-webfont.woff") format("woff"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'hk_groteskmedium'; src: url("/assets/fonts/hkgrotesk-medium-webfont.woff2") format("woff2"), url("/assets/fonts/hkgrotesk-medium-webfont.woff") format("woff"); font-weight: normal; font-style: normal; }
@font-face { font-family: 'hk_groteskbold'; src: url("/assets/fonts/hkgrotesk-bold-webfont.woff2") format("woff2"), url("/assets/fonts/hkgrotesk-bold-webfont.woff") format("woff"); font-weight: normal; font-style: normal; }
body { font-family: 'hk_groteskregular', arial, sans-serif; }

h1 { color: #284a82; font-size: 28px; }
h1 { font-size: 27px; }
@media screen and (min-width: 400px) { h1 { font-size: calc(0.2857142857vw + 25.8571428571px); } }
@media screen and (min-width: 1800px) { h1 { font-size: 31px; } }

h2 { font-size: 23px; font-weight: normal; line-height: 1.2; }
h2 { font-size: 22px; }
@media screen and (min-width: 400px) { h2 { font-size: calc(0.2857142857vw + 20.8571428571px); } }
@media screen and (min-width: 1800px) { h2 { font-size: 26px; } }

h3 { font-size: 20px; font-weight: normal; }
h3 { font-size: 19px; }
@media screen and (min-width: 400px) { h3 { font-size: calc(0.2857142857vw + 17.8571428571px); } }
@media screen and (min-width: 1800px) { h3 { font-size: 23px; } }

h4 { font-size: 17px; }
h4 { font-size: 15px; }
@media screen and (min-width: 400px) { h4 { font-size: calc(0.2857142857vw + 13.8571428571px); } }
@media screen and (min-width: 1800px) { h4 { font-size: 19px; } }

p, .container li { font-size: 17px; line-height: 1.5; }
p, .container li { font-size: 15px; }
@media screen and (min-width: 400px) { p, .container li { font-size: calc(0.2857142857vw + 13.8571428571px); } }
@media screen and (min-width: 1800px) { p, .container li { font-size: 19px; } }

h3 + p { margin-top: -12px; }

h4 + p { margin-top: -12px; }

a { color: #000000; }
a:hover { color: #0797D5; }

hr { border: 1px solid #0797D5; margin: 40px 0; }

.breadcrumb { color: #0797D5; font-size: 12px; }
.breadcrumb a { color: #444; text-decoration: none; }
.breadcrumb a:hover { text-decoration: underline; }

p > img { width: 180px; float: right; margin: 0 0 35px 25px; }

.container li { line-height: 1.4; margin: 0 0 5px 0; }

.cta, .get-in-touch { display: inline-block; box-sizing: border-box; padding: 4px 7px 6px; text-decoration: none; background: #0797D5; color: #ffffff; font-size: 12px; }
.cta:hover, .get-in-touch:hover { background: #00131E; }

.get-in-touch { font-size: 14px; }

.link-about .cta, .activity--coordinators a { background: #00131E; font-size: 16px; margin-top: 30px; padding: 10px 20px 11px; }
.link-about .cta:hover, .activity--coordinators a:hover { background: #0797D5; color: white; }
@media (min-width: 1000px) { .link-about .cta, .activity--coordinators a { font-size: 17px; } }

.case-studies--home-wrapper { background-image: url(/assets/images/mainimage.jpg); background-size: cover; padding: 60px 0; position: relative; left: 50%; transform: translateX(-50%); width: 100vw; clear: both; }
.case-studies--home-wrapper .case-studies--home { max-width: 840px; margin-left: auto; margin-right: auto; padding: 0 2.5%; }
@media (max-width: 710px) { .case-studies--home-wrapper .case-studies--home { justify-content: space-around; } }

.morecs { margin: 0 auto; max-width: 820px; }
.morecs a { color: white; float: right; font-size: 90%; text-decoration: none; }
.morecs a:hover { text-decoration: underline; }
.morecs a:before { content: ''; }

.case-studies--home, .case-studies--list { display: flex; flex-wrap: wrap; width: 100%; }
.case-studies--home > h2, .case-studies--list > h2 { width: 100%; }

.case-study--teaser:nth-of-type(1), .case-study--teaser:nth-of-type(2), .case-study--teaser:nth-of-type(3), .case-study--teaser:nth-of-type(4), .case-study--teaser:nth-of-type(5) { max-width: 400px; position: relative; float: left; margin-right: 15px; margin-top: 15px; align-self: flex-end; display: block; overflow: hidden; }
.case-study--teaser:nth-of-type(1) a, .case-study--teaser:nth-of-type(2) a, .case-study--teaser:nth-of-type(3) a, .case-study--teaser:nth-of-type(4) a, .case-study--teaser:nth-of-type(5) a { width: 100%; }
.case-study--teaser:nth-of-type(1) a:before, .case-study--teaser:nth-of-type(2) a:before, .case-study--teaser:nth-of-type(3) a:before, .case-study--teaser:nth-of-type(4) a:before, .case-study--teaser:nth-of-type(5) a:before { content: ""; display: block; height: 100%; width: 100%; position: absolute; background: #ffffff; z-index: 10; opacity: 0; }
.case-study--teaser:nth-of-type(1) a:hover:before, .case-study--teaser:nth-of-type(2) a:hover:before, .case-study--teaser:nth-of-type(3) a:hover:before, .case-study--teaser:nth-of-type(4) a:hover:before, .case-study--teaser:nth-of-type(5) a:hover:before { opacity: 0.2; }
.case-study--teaser:nth-of-type(1) img, .case-study--teaser:nth-of-type(2) img, .case-study--teaser:nth-of-type(3) img, .case-study--teaser:nth-of-type(4) img, .case-study--teaser:nth-of-type(5) img { display: block; height: auto; width: 100%; border-radius: 0; }
.case-study--teaser:nth-of-type(1) .case-study--title, .case-study--teaser:nth-of-type(2) .case-study--title, .case-study--teaser:nth-of-type(3) .case-study--title, .case-study--teaser:nth-of-type(4) .case-study--title, .case-study--teaser:nth-of-type(5) .case-study--title { background: #099B9B; min-height: 90px; display: block; width: 100%; position: absolute; bottom: 0; line-height: 80px; }
.case-study--teaser:nth-of-type(1) .case-study--title:before, .case-study--teaser:nth-of-type(2) .case-study--title:before, .case-study--teaser:nth-of-type(3) .case-study--title:before, .case-study--teaser:nth-of-type(4) .case-study--title:before, .case-study--teaser:nth-of-type(5) .case-study--title:before { content: ''; background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.2) 0%, rgba(255, 255, 255, 0) 80%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.2) 0%, rgba(255, 255, 255, 0) 80%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(255, 255, 255, 0) 80%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a000000', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */ display: block; height: 100%; position: absolute; width: 100%; z-index: 20; }
.case-study--teaser:nth-of-type(1) h2, .case-study--teaser:nth-of-type(2) h2, .case-study--teaser:nth-of-type(3) h2, .case-study--teaser:nth-of-type(4) h2, .case-study--teaser:nth-of-type(5) h2 { color: white; padding: 0 20px; font-size: 18px; font-weight: 400; display: inline-block; vertical-align: middle; line-height: 1.2; margin: 0; position: relative; z-index: 40; }

.case-study--teaser:nth-of-type(1) { width: 319px; height: 218px; }
.case-study--teaser:nth-of-type(1) .case-study--title { background: #099B9B; }
.case-study--teaser:nth-of-type(2) { width: 322px; height: 250px; }
.case-study--teaser:nth-of-type(2) .case-study--title { background: #0097AB; }
.case-study--teaser:nth-of-type(3) { width: 230px; height: 205px; align-self: flex-start; margin-left: 89px; }
.case-study--teaser:nth-of-type(3) .case-study--title { background: #0097AB; }
.case-study--teaser:nth-of-type(4) { width: 170px; height: 260px; align-self: flex-start; }
.case-study--teaser:nth-of-type(4) .case-study--title { background: #399D6D; }
.case-study--teaser:nth-of-type(5) { width: 280px; height: 235px; align-self: flex-start; margin-right: 0; }
.case-study--teaser:nth-of-type(5) .case-study--title { background: #099B9B; }

.case-study--teaser:nth-of-type(6) { margin-top: 80px; }

.case-study--teaser { width: 100%; }
.case-study--teaser img { width: 50px; height: 50px; background: #E7E7E7; float: left; margin-right: 20px; margin-bottom: 20px; }
.case-study--teaser h2 { font-size: 18px; line-height: 35px; margin-top: 8px; }
.case-study--teaser a { text-decoration: none; }

.case-study { background: #f1f1f1; margin-bottom: 30px; padding: 5px 20px 10px; }

a:hover .case-study { background: #e7e7e7; }
a:hover .case-study h2, a:hover .case-study p { color: initial; }

.csauth { font-size: 12px; font-weight: 600; }

header { background: #E7E7E7; padding: 10px 0; }
header .logo { height: 65px; width: auto; }

footer { clear: both; margin-top: 100px; display: inline-block; width: 100%; background: #E7E7E7; padding: 40px 0; font-size: 12px; }

footer ul { display: block; padding: 0; float: left; width: 100%; }
footer ul li { list-style-image: none; list-style-type: none; float: left; clear: both; margin-bottom: 10px; }
footer ul a { display: block; background: #00131E; box-sizing: border-box; padding: 4px 7px 6px; text-decoration: none; color: #ffffff; }
footer ul a:hover { background: #0797D5; color: #ffffff; }

.footer-2 a { background: #0797D5; }
.footer-2 a:hover { background: #00131E; }

.footer-3 p { font-size: 12px; }

@media (min-width: 600px) { .footer-block { width: 50%; float: left; } }
@media (min-width: 900px) { .footer-block { width: 33%; float: left; } }

.link-cookie { margin-left: 18px; }

.link-twitter, .link-youtube { display: block; font-weight: 800; margin-top: 18px; text-decoration: none; }

.link-youtube { margin-top: 3px; }

.constrained.container { padding-top: 40px; }

@media (min-width: 600px) { .page--type-case-studies .constrained.container, .page--type-activities .constrained.container { float: left; padding-left: 30%; width: 68%; }
  .page--type-case-studies .constrained.container .main-image, .page--type-activities .constrained.container .main-image { margin-left: -28%; position: absolute; padding-right: 30px; width: 25%; } }
@media (min-width: 800px) { .page--type-case-studies .constrained.container, .page--type-activities .constrained.container { float: initial; padding-left: 200px; max-width: 470px; }
  .page--type-case-studies .constrained.container .main-image, .page--type-activities .constrained.container .main-image { margin-left: -220px; width: 170px; } }
.page--type-case-studies .constrained.container .main-image, .page--type-activities .constrained.container .main-image { margin-top: -33px; }
.page--type-case-studies .constrained.container .main-image img, .page--type-activities .constrained.container .main-image img { width: 100%; }

.partner--related, .activity--coordinator { float: left; width: 100%; }
.partner--related img, .activity--coordinator img { width: 50px; height: 50px; border-radius: 50px; background: #E7E7E7; float: left; margin-right: 20px; }
.partner--related h3, .activity--coordinator h3 { margin-top: 10px; }
.partner--related .partner--text, .activity--coordinator .partner--text { display: block; float: left; width: calc(100% - 70px); }

.partner--related:last-of-type { margin-bottom: 20px; }

.partner--related { margin-bottom: 30px; }
.partner--related p { font-size: 14px; }

.activity--coordinator p { margin: 0; }

.activity--case-studies img { float: right; margin: 15px 0 20px 20px; width: 125px; }

.page--about-us .constrained.container, .page--our-activities .constrained.container { max-width: 665px; }

.activities--page { display: flex; justify-content: space-between; flex-wrap: wrap; }
.activities--page .activity--teaser img { height: 115px; }

.activities--home { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 60px; }
.activities--home h2 { font-weight: 600; font-size: 16px; width: 100%; }

.activity--teaser { width: 115px; }
.activity--teaser a { text-decoration: none; }
.activity--teaser img { height: 95px; }
.activity--teaser h3 { font-size: 17px; line-height: 15px; margin-bottom: 10px; }
.activity--teaser p { font-size: 14px; line-height: 1.2; margin-top: 0; }

.activities--teaser { float: left; margin: 30px 0; max-width: 300px; }
.activities--teaser img { height: 95px; }

.activity--case-studies a, .activities--teaser a { display: block; text-decoration: none; }
.activity--case-studies p, .activities--teaser p { font-size: 15px; margin-top: -10px; }

.blurb--home { max-width: 400px; float: left; margin-right: 50px; margin-bottom: 20px; }
@media (min-width: 745px) { .blurb--home { margin-bottom: 50px; } }
.blurb--home p { font-size: 120%; margin: 0; }

.cta--home { width: 220px; float: left; }
.cta--home a { font-size: 15px; margin-bottom: 10px; padding: 8px 15px 9px 45px; position: relative; }
@media (min-width: 767px) { .cta--home { margin-left: 20px; } }
@media (min-width: 1400px) { .cta--home a { font-size: 16px; } }

.cta--home a.groups { background-image: url(/assets/images/icon-chat.svg); background-position: 10px 9px; background-repeat: no-repeat; background-size: 26px; }
.cta--home a.blog { background-image: url(/assets/images/icon-medium.svg); background-position: 12px 7px; background-repeat: no-repeat; background-size: 23px; }
.cta--home a.github { background-image: url(/assets/images/icon-github.svg); background-position: 11px 1px; background-repeat: no-repeat; background-size: 25px; }
.cta--home a.recogito { background-image: url(/assets/images/icon-recogito.svg); background-position: 12px 7px; background-repeat: no-repeat; background-size: 24px; }
.cta--home a:last-of-type { margin-bottom: 30px; }

.page--welcome-to-pelgios-network header { background: #ffffff; }
.page--welcome-to-pelgios-network header .logo { height: 60px; margin-top: 20px; }
@media (min-width: 600px) { .page--welcome-to-pelgios-network header .logo { height: 100px; margin-top: 45px; } }
@media (min-width: 1000px) { .page--welcome-to-pelgios-network header .logo { margin-left: -41px; } }

#video-container { display: block; background: #e7e7e7; padding: 60px 0; position: relative; left: 50%; transform: translateX(-50%); width: 100vw; clear: both; }

.video { margin: 0 auto; max-width: 800px; }
.video iframe { height: 225px; margin: 0 5%; width: 90%; }
@media (min-width: 600px) { .video iframe { height: 450px; } }
@media (min-width: 820px) { .video iframe { margin: 0; width: 100%; } }

.partner { margin: 40px 0; }
.partner h2, .partner p { clear: right; display: -webkit-box; margin: 0; }
.partner a { text-decoration: none; }

.partner-logo { width: 50px; height: 50px; border-radius: 50px; background: #E7E7E7; clear: left; float: left; margin-right: 20px; }

body { margin: 0; overflow-x: hidden; }

.constrained { width: 90%; max-width: 1040px; margin-left: auto; margin-right: auto; position: relative; }
