@charset "UTF-8";

/*
Theme Name: MRC (Wordpress Version 2022)
Theme URI: https://www.xylolondon.com
Author: XYLO London | © 2022 XYLO Worldwide: All Rights Reserved.
Author URI: https://www.mediareform.org.uk
Description: The New Theme Design for Media Reform Coalition for 2022. Media Reform coordinates the work of advocacy groups campaigning to protect the public interest in light of the Leveson Inquiry and Communications Review.
Version: 1.0
Tags: Media, Journalism, Reform, Whitepaper
*/


.notes {
content: "You cannot mix animation and transition-delay." ;
content: ".issues and .key-issues are different - .isses control the issues section on the home page - .key-issues is the section covering the key issues pages" ;
}



/* ----------------------------- Core ---------------------------------- */

html {
scroll-behavior: smooth;
}

* {
margin: 0px;
}

html,
body {
font-family: 'Gotham Book';
font-size: 1.0em;
position: relative;
height: 100%;
color:var(--black);
}


body {
background-color: var(--offwhite);
transition: var(--ease);
}

body:hover{
background-color: var(--white);
}


body.lock {
overflow: hidden;
}


#thetop {
position: absolute;
top:0px;
}


.master-case {
position: relative;
min-height: calc(100vh - 500px);
}


.rotate.iphone {
background-color: var(--black);
display: none;
position: relative;
align-items: center;
justify-content: center;
width:100%;
height: 100%;
z-index: 1;
}


video {width: 100%;}

iframe {width: 100%; height:75vh; margin-bottom: 30px;}

iframe.soundcloud {width: 100%; height:250px; margin-bottom: 30px;}



::selection {
background: #FF9F9F; /* WebKit/Blink Browsers */
}
::-moz-selection {
background: #FF9F9F; /* Gecko Browsers */
}

:root {
--black: black;
--white: white;
--offblack: #1E1E1E;
--greyskull: #CECECE;
--offwhite: #e8e8e8;
--grey: #373737;
--lightwhite: #787878;
--red: #ff0019;
--ruby: #e00914; 
--softred: #ffebec;
--softruby: #ffd0d3;
--tomato: #850202; 
--rose: #e21b50; 
--sun: #fff2cc;
--ease: all 333ms cubic-bezier(0.800, 0.005, 0.195, 0.995);
--easier: all 222ms cubic-bezier(0.800, 0.005, 0.195, 0.995);
--adjheight: calc(100vh - 100px);
}



/* ------------------------- h1. h2, h3, h4, h5, ul, p, colors ----------------------- */


h1 {
font-family: 'Gotham Medium';
font-size: 2.6em;
}


h2 {
margin-bottom: 25px;
font-size: 1.8em;
}


h2.entry-title {
font-family: 'Gotham Medium';
font-size: 1.8em;
color:var(--black);
margin: 15px 0px 5px;
}

h2.entry-title a {
text-decoration: none;
color:inherit;
}

h2.entry-title a:hover {
text-decoration: underline;
}

h3 {
font-family: 'Gotham Medium';
font-size: 1.4em;
margin-bottom:10px;
}

h3 a {
color: inherit;
}



h3.bold {
font-family: 'Gotham Bold';
font-size: 1.4em;
}

h4 {
font-family: 'Gotham Medium';
font-size: 1.6em;
margin-top:15px;
margin-bottom:15px;
}




p {
margin-bottom:30px;
font-size: 1.2em;
text-align: justify;
color:var(--black);
}

p a {
font-family: 'Gotham Bold';
color: inherit;
}

p a:hover {
transition: var(--ease);
background-color: var(--black);
color:white;
text-decoration: none;
}



strong {
font-family: 'Gotham Bold';
}


.white {color:var(--white);}
.rose {color:var(--rose);}


.padding-bottom-15 {padding-bottom: 15px; }
.padding-bottom-25 {padding-bottom: 25px; }


.margin-bottom-15 {margin-bottom: 15px; }
.margin-bottom-25 {margin-bottom: 25px; }


/* ------------------------------ header -------------------------------- */



header {
display: block;
position: relative;
width:100%;
background-color: rgba(26,26,26,1);
z-index: 100;
}


header .headerimage {
position: absolute;
left:0px;
width:100vw;
height: 100%;
z-index:-1;
}


header .headerimage img {
width:100%;
height: 100%;
object-fit: cover;
}




header .header {
max-width: 1600px;
margin-left: auto;
margin-right: auto;
padding: 25px;
display: flex;
align-items: center;
justify-content: space-between; 
}


header .mobile-only {
display: none;
}

header .header .logo {
width: auto;
height: 35px;
}

header .header .logo img {
position: relative;
width: auto;
height: 100%;
top: 50%;
transform: translateY(-50%);
}


header .header .logo-mobile {
display: none;
}




header .header .search {
width:50px;
height: 50px;
padding: 15px;
margin-left: 15px;
}



header .header .search img {
width:100%;
height: auto;
}


header .header .search .searchbar {
position: absolute;
right:0px;
top:100px;
width: 100%;
height: 100px;
background-color: rgba(22,22,22,1);
clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
transition: var(--ease);
}


header .header .search.open .searchbar {
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}


header .header .search-mobile .searchbar {
position: absolute;
right:0px;
top:85px;
width: 100%;
height: 122px;
background-color: rgba(22,22,22,.96);
clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
transition: var(--ease);
}



header .header .search-mobile.open .searchbar {
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}



.searchbar form {
display: flex;
align-items: center;
margin:0 auto;
max-width: 1600px;
height: 100%;
padding: 0px 25px;
}

.searchbar form .screen-reader-text {
font-family: 'Gotham Bold';
font-size: 1.0em;
color:white;
margin-right: 25px;
}

.searchbar form input[type=search] {
font-family: 'Gotham Light';
font-size:1.2em;
height: 40px;
border:none;
padding: 10px 15px;
border-bottom:3px solid var(--white);
background-color: transparent;
margin-right: 25px;
cursor: pointer;
flex:1;
color:var(--greyskull);
}

.searchbar form input[type=search]:focus {
border:3px solid var(--white);
background-color: var(--white);
color:var(--black);
}


.searchbar form input[type=submit] {
font-family: 'Gotham Bold';
text-transform: uppercase;
text-align: center;
padding: 23px 100px;
border:none;
flex:0;
cursor: pointer;
background-color: var(--ruby);
border-bottom:3px solid var(--ruby);
color:var(--white);
transition: var(--ease);
}

.searchbar form input[type=submit]:hover {
background-color: var(--white);
border-bottom:3px solid var(--white);
color:var(--ruby);
flex:0;
}













/* ------------------------------ Master Navigation ----------------------------- */


.navigation > ul {
list-style: none;
margin:0px;
padding: 0px;
width: 100%;
display: flex;
justify-content: center;
}


.navigation > ul > li {
position: relative;
font-family: 'Gotham Bold';
font-size: 1.0em;
text-transform: uppercase;
display: block;
padding: 20px 20px 20px 20px;
height: 100%;
margin-left:5px;
color: var(--white);
}

.navigation > ul > li a {
color:inherit;
text-decoration: none;

}

.navigation > ul > li:nth-child(odd):hover { background-color: var(--red); }
.navigation > ul > li:nth-child(even):hover { background-color: var(--rose); }



.navigation > ul > li:hover::after {
content: '';
position: absolute;
bottom:-25px;
left:0px;
width: 100%;
height: 25px;
}


.navigation > ul > li:nth-child(odd):hover::after { background-color: var(--red); }
.navigation > ul > li:nth-child(even):hover::after { background-color: var(--rose); }


.navigation > ul > li > ul {
position: absolute;
top: 80px;
left: 0;
background: red;
list-style: none;
margin: 0;
z-index: 10;
padding: 20px 20px;
min-width: 500px;
clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
transition: var(--ease);
}



.navigation > ul > li:nth-child(odd)  > ul { background-color: var(--red); }
.navigation > ul > li:nth-child(even)  > ul { background-color: var(--rose); }





.navigation > ul > li:nth-last-child(2) > ul {
min-width: 333px;
}

.navigation > ul > li:nth-last-child(3) > ul {
min-width: 333px;
}




.navigation > ul > li:hover > ul {
transition-delay: 111ms;
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
}

.navigation > ul > li > ul > li {
font-family: 'Gotham Bold';
font-size: 1.0em;
text-transform: capitalize;
padding:20px 0px;
color: var(--offwhite);
border-bottom: 1px solid var(--offwhite);
transition: var(--ease);
}


.navigation > ul > li > ul > li:last-of-type {
border-bottom: none;
}


.navigation > ul > li > ul > li:hover {
font-family: 'Gotham Bold';
padding:20px 0px;
color: var(--white);
border-bottom: 1px solid var(--white);
}


.navigation > ul > li > ul > li:last-of-type:hover {
border-bottom: none;
}


.navi {
position: relative;
width:30px;
height: 20px;
cursor: pointer;
transition: var(--ease);
border-top: 2px solid var(--white);
border-bottom: 2px solid var(--white);
background-color: rgba(0,0,0,0);
left:0px;
display: none;
}

.navi:hover {
width:50px;
}

.navi::after {
content: '';
position: absolute;
top:50%;
transform:translateY(-50%);
width: 100%;
height: 2px;
background-color: var(--white);
}







/* ------------------------------ Overlay Navigation ----------------------------- */



.overlay-navigation {
position: fixed;
width: 100vw;
height: 100vh;
left:0px;
top:0px;
z-index: 1000;
clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
transition: var(--easier);
}

.overlay-navigation.open {
clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}




.overlay-navigation img {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
object-fit: cover;
z-index: -1;
}


.overlay-navigation .logo {
position: relative;
display: block;
width: auto;
height: 30px;
z-index: 1;
margin-left:25px;
margin-top:25px;
margin-bottom: 25px;
}

.overlay-navigation .logo img {
position: relative;
width: auto;
height: 100%;
top: 50%;
transform: translateY(-50%);
}



.overlay-navigation ul {
position: relative;
flex-direction: column;
display: flex;
height: auto;
z-index: 1;
padding:0px;
margin-left:30px;
margin-right: 30px;
}


.overlay-navigation ul li {
display: flex;
border-bottom: 2px solid var(--offblack);
padding:20px 0px;
}


.overlay-navigation ul li a {
position: relative;
margin-right: 25px;
font-family: 'Gotham Bold';
font-size: 1.25em;
display: block;
color: var(--white);
text-decoration: none;
}


.overlay-navigation ul li ul {
display: flex;
flex-direction: row;
margin-left: 0px;
border: none;
margin:0px;
}

.overlay-navigation ul li ul li {
border-bottom: 0px solid var(--offwhite);
margin-right:20px;
padding:0px;
}


.overlay-navigation ul li ul li a {
font-family: 'Gotham Book';
color:var(--offwhite);
}





.overlay-navigation .close-navigation {
position: absolute;
top: 30px;
right: 30px;
width: 50px;
height: 50px;
transition: var(--ease);
transform: rotateZ(0deg);
}



.overlay-navigation .close-navigation:hover {
transform: rotateZ(90deg);
}



.close-navigation .close-line-left {
position: absolute;
left: 0%;
top: 25px;
width: 100%;
height: 2px;
background-color: var(--white);
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}


.close-navigation .close-line-right {
position: absolute;
top: 25px;
width: 100%;
height: 2px;
background-color: var(--white);
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}


.close-navigation:hover .close-line-left,
.close-navigation:hover .close-line-right {
background-color: var(--rose);
}




/* ------------------------------ Master Footer ----------------------------- */

footer {
position: relative;
transition: var(--ease);
background-color: var(--black);
background-image: url("dotgrey.png");
z-index: 1;
}


footer:hover {
background-color: var(--red);
}


footer .footer {
position: relative;
margin: 0 auto;
max-width: 1600px;
z-index: 2;
padding:100px 25px;
}


footer .footer ul {
font-family: 'Gotham Bold';
font-size: 1.0em;
justify-content: space-between;
position: relative;
display: flex;
list-style-type: none;
margin:0px;
padding: 0px;
margin-bottom: 50px;
}



footer .footer ul a {
position: relative;
color:inherit;
text-decoration: none;
}




footer .footer ul li {
color: var(--white);
}

footer .footer ul li {
flex-basis: auto;
flex-shrink: 0;
flex-grow: 0;
margin-right: 50px;
}


footer .footer ul li:last-of-type {
margin-right: 0px;
}


footer .footer ul li:first-child img {
position: relative;
width:100px;
height: auto;
}



footer .footer ul li ul {
list-style-type: none;
margin:0px;
margin-top: 8px;
padding: 0px;
display: block;
}


footer .footer ul li ul li {
color:var(--offwhite);
font-family: 'Gotham Light';
font-size: 1.0em;
line-height: 1.4em;
}


footer .footer ul li ul.socials i {
font-size: 1.4em;
margin-right:20px;
}



footer .footer .legal {
display: flex;
position: relative;
justify-content: space-between;
}


footer .footer .legal p {
font-family: 'Gotham Bold';
font-size: 0.6em;
text-transform: uppercase;
list-style-type: none;
margin:0px;
padding: 0px;
margin-bottom: 50px;
color: var(--white);
}



footer .footer .legal p a {
padding: 9px 3px;
color:inherit;
background-color: transparent;
transition: var(--ease);
}


footer .footer .legal p a:hover {
color:var(--black);
background-color: var(--white);
}









/* --------------------------------- swiper -------------------------------- */


.swiper {
width: 100%;
height: 100%;
}


.swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}

.swiper-slide img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}



.hero.swiper {
position: relative;
height: calc(100vh - 100px);
background-color: var(--offblack);
}



.hero.swiper .swiper-slide img {
position: absolute;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}


.hero.swiper .swiper-slide .case {
position: relative;
width: 100%;
max-width: 1600px;
height: 100%;
padding: 0px 25px;
}




.hero.swiper .swiper-slide .case .headlines {
position: absolute;
display: block;
bottom:0px;
left:0px;
height: auto;
max-width: 740px;
padding: 44px;
text-align: left;
background-color: var(--white);
transition: var(--easier);
}

.hero.swiper .swiper-slide .case .headlines:hover {
color:white;
}

.hero.swiper .swiper-slide:nth-child(3n) .case .headlines:hover { background-color: var(--tomato); }
.hero.swiper .swiper-slide:nth-child(3n-1) .case .headlines:hover { background-color: var(--ruby); }
.hero.swiper .swiper-slide:nth-child(3n-2) .case .headlines:hover { background-color: var(--rose); }




.hero.swiper .swiper-slide .case .headlines:hover .entry-content  a.more-link:hover {
border:3px solid var(--white);
background-color: var(--white);
color:var(--tomato);
}


.hero.swiper .swiper-slide:nth-child(3n) .case .headlines:hover .entry-content  a.more-link:hover { color:var(--tomato); }
.hero.swiper .swiper-slide:nth-child(3n-1) .case .headlines:hover .entry-content  a.more-link:hover { color:var(--ruby); }
.hero.swiper .swiper-slide:nth-child(3n-2) .case .headlines:hover .entry-content  a.more-link:hover { color:var(--rose);  }



.hero.swiper .swiper-slide:nth-child(3n) .case .headlines .entry-content  a.more-link { border:3px solid var(--tomato); color:var(--tomato); }
.hero.swiper .swiper-slide:nth-child(3n-1) .case .headlines .entry-content  a.more-link { border:3px solid var(--ruby); color:var(--ruby); }
.hero.swiper .swiper-slide:nth-child(3n-2) .case .headlines .entry-content  a.more-link { border:3px solid var(--rose); color:var(--rose); }





.hero.swiper .swiper-slide .case .headlines:hover .entry-content  a.more-link {
border:3px solid var(--white);
background-color: transparent;
color:var(--white);
}





.swiper-hero-arrows {
position: absolute;
bottom: -15px;
right: 50px;
width:170px;
height: auto;
display: flex;
align-items: center;
z-index: 1;
}


.swiper-hero-arrows .left,
.swiper-hero-arrows .right {
position: relative;
height: 100%;
background-color: var(--black);
background-image: url("dot.png");
transition: var(--easier);
cursor: pointer;
} 

.swiper-hero-arrows .left:hover,
.swiper-hero-arrows .right:hover {
background-color: var(--red);
} 



.swiper-hero-arrows .left,
.swiper-hero-arrows .right{
padding: 40px 25px;
margin-right: 2px;
flex:1;
}


.swiper-hero-arrows .left .arrow-left,
.swiper-hero-arrows .right .arrow-right {
position: relative;
width:auto;
height: auto;
}


.swiper-hero-arrows .right {
margin-left: 2px;
flex:1;
}


/* ------------------------------ A - Z ----------------------------- */


.anchor {
position: relative;
width: 100px;
height:0px;
top:0px;
}


a.more-link {
font-family: 'Gotham Medium';
margin-top: 5px;
padding: 5px 20px 5px 5px;
position: relative;
display:block;
width: 175px;
color:inherit;
text-decoration: none;
transition: var(--easier);
}

a.more-link:hover {
color:var(--white);
}

a.more-link::after {
content: '';
position: absolute;
left: 0px;
bottom: 0px;
width: 100%;
height: 2px;
background-color: var(--black);
transition: var(--easier);
z-index: -1;
}

a.more-link:hover::after {
width: 100%;
height: 100%;
background-color: var(--black);
}




.arrow-svg {
fill:none;
stroke:#FFFFFF;
stroke-miterlimit:10;
  stroke-width: 2;
}



.breadcrumbs {
border-bottom: solid 2px var(--greyskull);
position: relative;
margin: 0 auto;
padding: 50px 25px 25px 0px;
max-width: 1550px;
overflow: hidden;
margin-left: 25px;
margin-right: 25px;
}

.breadcrumbs p {
font-size: 0.9em;
margin-bottom: 0px;
color:var(--greyskull);
}




blockquote {
position: relative;
padding: 50px;
margin-bottom: 50px;
margin-right:50px;
background-color: var(--offwhite);
border: 2px solid var(--offblack);
transition: var(--ease);
}


blockquote::after {
content: '';
position: absolute;
width:100%;
height: 100%;
top:25px;
left:222px;
background-color: var(--rose);
z-index: -1;
}

body:hover blockquote {
background-color: var(--white);
}


blockquote p {
margin-bottom: 0px;
}


blockquote.bigger p {
font-family: 'Gotham Bold';
font-size: 2.0em;
}

blockquote.bigger cite {
margin-top: 25px;
font-family: 'Gotham Medium';
font-style: normal;
font-size: 1.2em;
}





.box.black {
display: inline-block;
font-family: 'Gotham Medium';
text-transform: uppercase;
font-size: 1.0em;
border:2px solid var(--offblack);
padding:15px 35px;
color:var(--offblack);
}



.box.white {
display: inline-block;
font-family: 'Gotham Medium';
text-transform: uppercase;
font-size: 1.0em;
border:2px solid var(--white);
padding:15px 35px;
color:var(--white);
}



.box.red {
display: inline-block;
font-family: 'Gotham Medium';
text-transform: uppercase;
font-size: 1.0em;
border:2px solid var(--red);
padding:15px 35px;
color:var(--red);
}




.bg  {
position: relative;
width: 100%;
height: auto;
left:0px;
top:0px;
z-index: 0;
}


.bg img {
position: absolute;
width:100%;
height:100%;
object-fit: cover;
}

.bg.twitter {
background-color: var(--softruby);
}



.button {
font-family: 'Gotham Bold';
position: relative;
text-align: center;
text-transform: uppercase;
padding:15px 75px;
display: block;
width: 300px;
margin:0 auto;
cursor: pointer;
z-index: 0;
}

.button:hover {
color:var(--white);
}

.button::after {
content: '';
z-index: -1;
position: absolute;
width: 100%;
left:0px;
bottom: 0px;
height: 0%;
transition: var(--easier);
}


.button:hover::after {
height: 100%;
}


.button.wider {
width:500px;
}



.button a {
color:inherit;
}

.button a, 
.button a:hover {
text-decoration: none;
}






.button.black { border: 3px solid var(--black); }
.button.black:hover { color:var(--white);}
.button.black::after { background-color: var(--black);}


.button.white { border: 3px solid var(--white); background-color: transparent; }
.button.white:hover { color:var(--black);}
.button.white::after { background-color: var(--white);}

.button.align-left { margin:auto; margin-left:0px!important; }









.entry-author a {
color:inherit;
text-decoration: none;
}

.entry-author a:hover {
color:inherit;
text-decoration: underline;
}






hr {
display: block;
border-width: 1px;
border-color: var(--greyskull);
border-style: solid;
margin: 50px 0px;
clear: both;
}


hr.tzp {
display: block;
border-width: 1px;
border-color: transparent;
border-style: solid;
margin: 100px 0px;
clear: both;
}


hr.clear {
display: block;
border-color: transparent;
clear: both;
}



.headlines h2 {
font-family: 'Gotham Bold';
font-size: 2.8em;
line-height: 1.1em;
}


.headlines p {
font-family: 'Gotham Medium';
display: block;
color: inherit;
font-size: 1.0em;
}



.headlines h2 a {
text-decoration: none;
color:inherit;
}






.headlines .entry-content {
display: block;
color:inherit;
font-family: 'Gotham Medium';
font-size: 1.0em;
}




.headlines .entry-content  a.more-link {
font-family: 'Gotham Bold';
display: block;
width: 260px;
margin-top: 25px;
padding: 15px 30px;
text-decoration: none;
transition: var(--ease);

}

.headlines .entry-content  a.more-link:hover {
border:3px solid var(--tomato);
background-color: var(--tomato);
color:var(--white);
}

.headlines .entry-content  a.more-link::after {
content: ' ▸';
}






.key-issue-link + h3 {
margin-top: 25px;
}




.key-issue-link {
font-family: 'Gotham Bold';
position: relative;
text-align: left;
display: block;
width: 500px;
margin:0 auto;
cursor: pointer;
z-index: 0;
font-size: 1.4em;
margin-left: 0px!important;	
overflow: hidden;
}


.key-issue-link::before {
content: '';
position: absolute;
width:100%;
height: 3px;
bottom:0px;
transition: var(--ease);
}




.key-issue-link::after {
content: '';
background: transparent url(key-issue-arrow.svg) no-repeat center center;
position: absolute;
right:0px;
top:65px;
width: 93px;
height: 30px;
background-size: 93px 30px;
overflow: hidden;
transition: var(--ease);
}

.key-issue-link:hover::after{
top:17px;
}




.key-issue-link a {
display: block;
padding:20px 0px;
transition: var(--ease);
text-decoration: none;
color:inherit;
}

.key-issue-link a:hover {
text-decoration: none;
color:var(--black);
}




.key-issues .key-issue-link:nth-of-type(odd) { color: var(--red); }
.key-issues .key-issue-link:nth-of-type(even) { color: var(--ruby); }
.key-issues .key-issue-link:nth-of-type(odd)::before { background-color: var(--red); }
.key-issues .key-issue-link:nth-of-type(even)::before { background-color: var(--ruby); }



.key-issues .key-issue-link:hover::before { background-color: var(--black); }



.margin-bottom-15 { margin-bottom: 15px; }
.margin-bottom-25 { margin-bottom: 25px; }



.noresults {
position: relative;
display: block;
padding: 50px;
background-color: var(--softred);
margin-right: 50px;
margin-bottom: 50px;
}

.noresults::after {
content: '';
position: absolute;
background-color: var(--softruby);
width: 100%;
height: 100%;
left:50px;
top:50px;
z-index: -1;
}






.section .pagination {
font-family: 'Gotham Medium';
font-size: 1.2em;
text-align: center;
padding-top: 25px;
border-top: 2px solid var(--red);
margin-top: 25px;
color: var(--red);
}




.section .pagination a {
color: inherit;
}







.section {
position: relative;
margin:0 auto;
max-width: 1280px;
padding: 50px 25px;
overflow: hidden;
}







.section ul {
clear: both;
position: relative;
font-size: 1.2em;
list-style: none;
margin: 0;
margin-bottom: 50px;
padding: 44px;
border: 2px solid var(--black);
transition: var(--easier);
}


.section ul:nth-of-type(odd):hover { background-color: var(--softruby); }

.section ul:nth-of-type(even):hover { background-color: var(--softred); }



.section ul p {
font-size: 1.0em;
margin-bottom: 0px;
}


.section ul li {
position: relative;
text-align: justify;
padding-right: 0px;
margin-bottom: 5px;
}

.section ul li:first-of-type {
margin-top: 10px;
}

.section ul li:before {
content: '+';
position: absolute;
left:-15px;
top:0px;
}

.section ul li b {
font-family: 'Gotham Medium';
margin-right: 5px;
}

.section ul li a {
font-family: 'Gotham Medium';
color: inherit;
}








.section.key-issues,
.section.blog {
position: relative;
margin:0 auto;
max-width: 1280px;
padding: 50px 25px;
overflow: hidden;
}






.section.blog .image {
width:100%;
height:250px;
}

.section.blog .image img {
width:100%;
height:100%;
object-fit: cover;
opacity: 0.88;
transition: var(--ease);
}


.section.blog .image img:hover {
opacity: 1.0;
}

.section.blog .button {
margin-top: 50px;
}




.section.blog img {
width: 33%;
height: auto;
float: left;
margin-right: 50px;
margin-bottom: 30px;
}




.section.donate .case {
display: flex;
justify-content: space-around;
align-items:center;
}


.section.donate .case > div {
padding-right: 25px;
}

.section.donate .case > div:last-child {
padding-right: 75px;
}

.section.donate .case .donate-hype h1 {
font-family: 'Neutraface Slab Text';
font-size: 5.0em;
line-height: 0.9em;
letter-spacing: -2px;
}

.section.donate .donate-hype {
flex:6;
}
.section.donate .donate-content {
flex:6;
}

.section.donate .button {
flex-basis: 300px;
flex-grow: 0;
flex-shrink: 0;
}





.section.bbc video {
position: relative;
width:100%;
height: auto;
z-index: 1;
}







.section.bbc .headlines {
position: absolute;
display: block;
bottom: 0px;
right: 0px;
height: auto;
max-width: 568px;
padding: 55px;
text-align: left;
background-color: #05007f;
transition: var(--easier);
z-index: 2;
}




.section-bg-black {
background: linear-gradient(224deg, #000000, #300000, #222222, #111111, #241010);
background-size: 1000% 1000%;
-webkit-animation: mrc 59s ease infinite;
-moz-animation: mrc 59s ease infinite;
animation: mrc 59s ease infinite;		
}

.section-bg {
background: linear-gradient(224deg, #ff0000, #fb6600, #fb9d00, #fb004b, #dd0000);
background-size: 1000% 1000%;
-webkit-animation: mrc 59s ease infinite;
-moz-animation: mrc 59s ease infinite;
animation: mrc 59s ease infinite;		
}














.section.general-overview {
position: relative;
margin: 0 auto;
max-width: 1280px;
padding: 50px 25px;
padding-bottom: 150px;
overflow: hidden;
}



.section.general-overview h2 {
    margin-bottom: 5px;
}




.section.general-overview figure.wp-block-image {
position: relative;
width: 50%;
height: 400px;
margin-right: 100px;
margin-bottom: 50px;
}


.section.general-overview figure.wp-block-image:nth-last-of-type(odd) { float: left; }
.section.general-overview figure.wp-block-image:nth-last-of-type(even) { float: right; margin-left: 25px; }




.section.general-overview figure.wp-block-image::after {
content: '';
position: absolute;
right: -65px;
bottom: -30px;
width: 100%;
height: 100%;
transition: var(--easier);
z-index: -1;
}

.section.general-overview figure.wp-block-image img {
width: 100%;
height: 100%;
object-fit: cover;
}



.section.general-overview figure.wp-block-image:nth-of-type(1n)::after { background-color: var(--rose);}
.section.general-overview figure.wp-block-image:nth-of-type(2n)::after { background-color: var(--red);}
.section.general-overview figure.wp-block-image:nth-of-type(3n)::after { background-color: var(--tomato);}








.section.general-overview h1 {
margin-bottom: 25px;
}





.section.general-overview p.read-more a {
font-family: 'Gotham Medium';
font-size: 1.2em;
position: relative;
display: inline-block;
padding: 15px;
text-decoration: none;
z-index: 2;
background-color: transparent;
transition: var(--easier);
}


.section.general-overview p.readmore a:hover {
background-color: transparent;
color: var(--white);
}



.section.general-overview p.read-more a::before {
content: '';
position: absolute;
left: 0px;
bottom: 0px;
width: 100%;
height: 2px;
background-color: var(--black);
transition: var(--easier);
z-index: -1;
}


.section.general-overview p.read-more a:hover::before {
height: 100%;
}


.section.general-overview p.read-more a::after { 
content: '▶';
margin-left: 30px;
}







.section.issues {
position: relative;
margin: 0 auto;
max-width: 1280px;
padding: 50px 25px;
overflow: hidden;
}



.section.issues h1 {
font-family: 'Gotham Bold';
font-size: 2.8em;
padding-bottom: 15px;
}

.section.issues h2 {
font-family: 'Gotham Light';
font-size: 1.6em;
padding-bottom: 15px;
}


.section.issues .case {
position: relative;
display: flex;
align-items: center;
margin-bottom: 55px;
}

.section.issues .case:nth-last-of-type(even) { flex-direction: row; }
.section.issues .case:nth-last-of-type(odd) { flex-direction: row-reverse; }



.section.issues .case div img {
position: relative;
width: 100%;
height: auto;
}

.section.issues .case .key-issues-img::after {
content: '';
position: absolute;
right:-65px;
bottom: -30px;
width: 100%;
height: 100%;
background-color: var(--rose);
transition: var(--easier);
z-index: -1;	
}


.section.issues .case:nth-last-of-type(even) .key-issues-img::after {
background-color: var(--red);
}




.section.issues .case div a {
font-family: 'Gotham Medium';
font-size: 1.2em;
position: relative;
display: inline-block;
padding: 15px;
text-decoration: none;
z-index: 2;
transition: var(--easier);
}


.section.issues .case div a:hover {
color: var(--black);
}



.section.issues .case div a::before {
content: '';
position: absolute;
left:0px;
bottom: 0px;
width: 100%;
height: 2px;
background-color: var(--white);
transition: var(--easier);
z-index: -1;
}


.section.issues .case div a:hover::before {
width: 100%;
height: 100%;
}




.section.issues .case div a::after {
content: '▶';
margin-left: 30px;
}






.section.issues .case > div:first-child {
flex:1;
padding-right: 0px;
z-index: 2;
}

.section.issues .case:nth-of-type(odd) > div:first-child {
padding-left: 35px;
}


.section.issues .case > div:last-child {
position: relative;
flex:1;
z-index: 1;
}




.section.overview {
padding-right: 0px;
}

.section.overview h1 {
position: relative;
font-size: 1.6em;
display: block;
margin-bottom: 33px;
}


.section.overview h1 a {
color: inherit;
text-decoration: none;
}

.section.overview h1 a:hover {
text-decoration: underline;
}



.section.overview h1.special {
display: block;
background-color: var(--rose);
color:var(--white);
padding: 16px;
margin-bottom: 55px;
}

.section.overview h1.special::before {
content: '';
position: absolute;
left:15px;
top:15px;
width: 100%;
height: 100%;
background-color: var(--ruby);
z-index: -1;
}







.section.overview .case {
position: relative;
display: flex;
}

.section.overview .case div:nth-child(1),
.section.overview .case div:nth-child(2) {
padding-right: 50px;
flex:1;
}





.section.newsletter{
padding:125px 25px;
}



.section.newsletter .case {
display: flex;
align-content: center;
}


.section.newsletter .newsletter-hype {
padding-right: 50px;
}



.section.newsletter .newsletter-form {
flex-basis: 500px;
flex-grow: 0;
flex-shrink: 0;
}



.section.newsletter .newsletter-form h2,
.section.newsletter .newsletter-form h4,
.section.newsletter .newsletter-form span,
.section.newsletter .newsletter-form ul,
.section.newsletter .newsletter-form .can_thank_you-block,
.section.newsletter .newsletter-form .ajax-loading,
.section.newsletter .newsletter-form .action_owner
/*--- This is for the Action Network Newsletter Plugin Form / CSS -----*/
{
display: none;
}


.section.newsletter .newsletter-form h1, 
.section.newsletter .newsletter-form span {
color:var(--white);
}

.section.newsletter .newsletter-form .left {
display: block;
color:var(--white);
margin-bottom: 10px;
}


.section.newsletter .newsletter-form .left small {
display: block;
margin-top: 10px;
}


.section.newsletter .newsletter-form .left a {
color:inherit;
}


.section.newsletter .newsletter-form li {
list-style-type: none;
margin-bottom: 15px;
}


.section.newsletter .newsletter-form img {
display: none;
}


.section.newsletter .newsletter-form .ajax-loading {
width: auto;
object-fit: none;
height: auto;
}








.section.newsletter b {
font-family: 'Gotham Medium';
}

.section.newsletter .mrw {
position: relative;
flex-basis: 225px;
flex-grow: 0;
flex-shrink: 0;
margin-right: 50px;
}

.section.newsletter .mrw img {
width: 100%;
height: auto;
}


.section.newsletter label {
position: relative;
font-family: 'Gotham Medium';
font-size: 1.0em;
color: var(--black);
z-index: 2;
}


.section.newsletter label::before {
content: '';
position: absolute;
width:222px;
height: 20px;
background-color: var(--white);
z-index:-1;
}




.section.newsletter form input {
font-family: 'Gotham Medium';
font-size: 1.0em;
width: 100%;
padding: 10px 15px;
border: 3px solid var(--white);
background-color: black;
margin-right: 0px;
color: var(--greyskull);
}

.section.newsletter form input[type="submit"] {
font-family: 'Gotham Bold';
font-size: 1.0em;
position: relative;
text-align: center;
text-transform: uppercase;
border: 3px solid var(--white);
background-color: var(--white);
color:var(--black);
padding: 15px 75px;
display: block;
width: 300px;
cursor: pointer;
z-index: 0;
transition: var(--easier);
}




.section.newsletter form input[type="submit"]:hover {
border: 3px solid var(--black);
background-color: var(--black);
color:var(--white);
}



.section.pages {
max-width: 1280px;
}

.section.pages .team-members-case {
margin-top:50px;
margin-bottom: 25px;
position: relative;
display: flex;
}

.section.pages .team-members {
width:auto;
text-align: center;
flex: 1;
margin:0px 25px;
}


.section.pages .team-members img {
position: relative;
clip-path: ellipse(46% 46% at 50% 50%);
width: 300px;
margin: 0 auto;
height: auto;
float: none;
margin-bottom: 25px;
filter: grayscale(100%);
transition: var(--ease);
}


.section.pages .team-members img:hover {
clip-path: ellipse(50% 50% at 50% 50%);
filter: grayscale(0%);
}


.section.pages figure.logo-partners {
position: relative;
width: 25%;
float: left;
padding: 25px 50px;
}

.section.pages figure.logo-partners:nth-of-type(4n + 1) {
clear:left;
}


.section.pages figure.logo-partners figcaption {
color: inherit;
text-align: center;
}


.section.pages figure.logo-partners figcaption a {
color: inherit;
text-decoration: none;
}

.section.pages figure.logo-partners figcaption a:hover {
text-decoration: underline;
}



.section.pages figure.logo-partners img {
position: relative;
width: 100%;
height: auto;
float: none;
margin-right: 0px;
margin-bottom: 15px;
filter: grayscale(1);
transition: var(--ease);
}



.section.pages figure.logo-partners img:hover {
filter: grayscale(0);
}








.section.pages img {
width: 33%;
height: auto;
float: left;
margin-right: 50px;
margin-bottom: 30px;
}




.section.pages ul {
clear: both;
position: relative;
font-size: 1.2em;
list-style: none;
margin: 0;
margin-bottom: 50px;
padding: 44px;
border: 2px solid var(--black);
transition: var(--easier);
}

.section.pages ul:hover {
background-color: var(--softred);
}

.section.pages ul li {
position: relative;
text-align: justify;
padding-right: 0px;
margin-bottom: 10px;
}

.section.pages ul li:before {
content: '+';
position: absolute;
left:-15px;
top:0px;
}









.section.pages h1 {
position: relative;
}



.section.pages h1 {
position: relative;
}

.section.pages h1 {
margin-top: 100px;
margin-bottom: 25px;
}

.section.pages h1:first-of-type {
margin-top: 0px;
margin-bottom: 25px;
}

.section.pages h1::before {
content: '';
position: absolute;
top:-50px;
left:0px;
width:100%;
height: 4px;
background-color: var(--greyskull);
z-index: -1;
}

.section.pages h1:first-of-type::before {
background-color: transparent;
}


.section.pages h2 {
display: inline-block;
position: relative;
font-family: 'Gotham Bold';
}



.section.pages h2::after {
content: '';
position: absolute;
top:15px;
left:15px;
width: 100%;
height: 100%;
z-index: -1;
}

.section.pages h2:nth-last-of-type(odd)::after { background-color: var(--softred); }

.section.pages h2:nth-last-of-type(even)::after { background-color: var(--softruby); }




.section.pages  iframe { margin-bottom: 75px; }



.sharedaddy { display: none; }





/*----------------------------*/




.section.key-issues ul {
clear: both;
position: relative;
font-size: 1.2em;
list-style: none;
margin: 0;
margin-bottom: 50px;
padding: 44px;
border: 2px solid var(--black);
transition: var(--easier);
}


.section.key-issues ul:hover {
background-color: var(--softruby);
}



.section.key-issues ul p {
font-size: 1.0em;
margin-bottom: 0px;
}




.section.key-issues ul li {
position: relative;
text-align: justify;
padding-right: 0px;
margin-bottom: 5px;
}

.section.key-issues ul li:first-of-type {
margin-top: 10px;
}

.section.key-issues ul li:before {
content: '+';
position: absolute;
left:-15px;
top:0px;
}

.section.key-issues ul li b {
font-family: 'Gotham Medium';
margin-right: 5px;
}





.section.key-issues h1 {
position: relative;
}

.section.key-issues h1 {
margin-top: 100px;
margin-bottom: 25px;
}

.section.key-issues h1:first-of-type {
margin-top:25px;
margin-bottom: 25px;
}

.section.key-issues h1::before {
content: '';
position: absolute;
top:-50px;
left:0px;
width:100%;
height: 4px;
background-color: var(--greyskull);
}

.section.key-issues h1:first-of-type::before {
background-color: transparent;
}



.section.key-issues h2 {
display: inline-block;
position: relative;
font-family: 'Gotham Bold';
}

.section.key-issues h2::after {
content: '';
position: absolute;
top: 15px;
left: 15px;
width: 100%;
height: 100%;
z-index: -1;
}

.section.key-issues h2:nth-last-of-type(odd)::after { background-color: var(--softred); }
.section.key-issues h2:nth-last-of-type(even)::after { background-color: var(--softruby);}






.section.key-issues .emphasize {
position: relative;
display: block;
padding: 50px;
background-color: var(--softred);
margin-right: 50px;
margin-bottom: 50px;
}

.emphasize::after {
content: '';
position: absolute;
background-color: var(--softruby);
width: 100%;
height: 100%;
left:50px;
top:50px;
z-index: -1;
}

.section.key-issues .emphasize.inv { background-color:var(--softruby); }
.section.key-issues .emphasize.inv::after  { background-color:var(--softred); }





.section.key-issues .emphasize + h1 {margin-top: 100px;}



.section.pages ol,
.section.key-issues ol {
position: relative;
font-family: 'Gotham Bold';
font-size: 1.2em;
list-style: none;
margin: 0px;
padding: 0px;
background-color: white;
border: 0px solid var(--black);
margin-bottom: 22px;
cursor: pointer;
}



.section.pages ol:before {
content: '+';
position: absolute;
top:25px;
left:333px;
z-index: 3;
}


.section.key-issues ol:before {
content: '+';
position: absolute;
top:25px;
left:10px;
z-index: 3;
}

.section.pages ol:after,
.section.key-issues ol:after {
content: '';
position: absolute;
background-color: var(--ruby);
top:11px;
left:11px;
width:100%;
height: 100%;
z-index: -1;
}


.section.pages ol li:first-of-type,
.section.key-issues ol li:first-of-type {
background-color: white;
transition: var(--ease);
}

.section.pages ol li:first-of-type:hover,
.section.key-issues ol li:first-of-type:hover {
background-color: var(--softruby);
}


.section.pages ol li,
.section.key-issues ol li {
font-family: 'Gotham Book';
position: relative;
margin-top:0px;
border: 2px solid var(--ruby);
padding: 22px;
}

.section.pages ol li a,
.section.key-issues ol li a {
font-family: 'Gotham Medium';
color:inherit;
}

.section.pages ol li:nth-of-type(odd),
.section.key-issues ol li:nth-of-type(odd) {
font-family: 'Gotham Bold';
border: 2px solid var(--ruby);
}

.section.pages ol li:nth-of-type(even),
.section.key-issues ol li:nth-of-type(even) {
display: none;
border: 2px solid var(--ruby);
border-top: 2px solid transparent;
}

.section.pages ol:last-of-type li:nth-of-type(even),
.section.key-issues ol:last-of-type li:nth-of-type(even) {
border: 2px solid var(--ruby);
border-top: 2px solid transparent;
border-bottom: 2px solid var(--ruby);
}

.section.pages ol:last-of-type,
.section.key-issues ol:last-of-type {
margin-bottom: 50px;
}






.section.pages ol li ul,
.section.key-issues ol li ul {
font-family: 'Gotham Book';
font-size: 1.0em;
list-style: none;
margin: 0px;
padding: 0px;
background-color: white;
border: 0px solid var(--black);
margin-left:25px;
cursor: pointer;
}


.section.pages ol li ul:hover,
.section.key-issues ol li ul:hover {
background-color: transparent!important;
}


.section.pages ol li ul li,
.section.key-issues ol li ul li {
position: relative;
display: block!important;
font-family: 'Gotham Book'!important;
font-size: 1.0em;
padding-right: 0px;
margin-bottom: 5px;
border: 0px!important;
padding: 0px;
border-top: 0px!important;
border-bottom: 0px!important;
}


.section.pages ol li ul li:hover,
.section.key-issues ol li ul li:hover {
background-color: transparent!important;
}


.section.pages ol li ul li:before,
.section.key-issues ol li ul li:before {
content: '+';
position: absolute;
left: -25px;
top: 0px;
}





.section.key-issues img {
width: 33%;
float: left;
margin-right: 50px;
margin-bottom: 30px;
}

.section.blog blockquote:nth-of-type(even) {  background-color: var(--black); }

.section.blog blockquote:nth-of-type(even) p { color:white; }






.wp-block-embed-twitter {
position: relative;
float: left;
margin-right: 50px;
z-index: 2;
}

.twitter-tweet {	
position: relative;
float: left;
margin-right: 50px;
z-index: 2;	
}






/* ------------------------------ Gradient Animator  ----------------------------------- */



@-webkit-keyframes mrc {
0%{background-position:84% 0%}
50%{background-position:17% 100%}
100%{background-position:84% 0%}
}
@-moz-keyframes mrc {
0%{background-position:84% 0%}
50%{background-position:17% 100%}
100%{background-position:84% 0%}
}
@keyframes mrc {
0%{background-position:84% 0%}
50%{background-position:17% 100%}
100%{background-position:84% 0%}
}





/* ------------------------------ Bywire, E-Mail Subscribers  ----------------------------------- */


.es-field-wrap {
margin-bottom: 10px;
}


.bywire-privacy-notice {
color:var(--lightwhite);
border: 2px solid var(--lightwhite);
padding:25px;
text-align: center;
transition: var(--ease);
margin-bottom: 50px;
}


.bywire-privacy-notice a {
color:var(--lightwhite);
transition: var(--ease);
}

footer:hover .bywire-privacy-notice {
border: 2px solid var(--white);
color:var(--white);

}
footer:hover .bywire-privacy-notice a {
color:var(--white);
}












