.clearboth {
   clear: both;
}


div#header_cookies {
   width: 80%; margin: 0 auto; margin-top: 5px; margin-bottom: 5px; border: 4px solid #263E5F; padding: 3px;
   font-size: 1.2em;
   line-height: 1.2em;
   text-align: center;
   color: white;
   background-color: #004E8F;
}

div#header_cookies a {
   color: white;
   text-decoration: underline;
}

img.left {
	float: left; 
	padding: 0.2em;
    padding-left: 0.15em;
	margin-right: 0.7em;
    margin-left: 0;
    margin-bottom: 0.7em;
    border: 1px solid #d0d0d0;	
}


img.right {
   float: right;
   padding: 0.2em;
   padding-right: 0.15em;
   margin-right: 0;
   margin-left: 0.7em;
   margin-bottom: 0.7em;
   border: 1px solid #d0d0d0;
}

h2.pageheadingunderline {
   font-size: 1.9em;
   border-bottom: 1px solid #226DAC;
   margin-right: 0.5em;
}

a {
   word-wrap: break-word;
}

div.archivedmaterial {
/*   background-color: #f9f9f9;*/
   background-color: #ffffff;
   border-bottom: 4px solid #226dac;
/*   border: 2px solid #226DAC;*/
/*   border-top: 8px solid #226DAC;*/
   padding: 0.0em 0.6em 0.6em 0.6em;
   margin-left: -6px;
   margin-right: -4px;
   margin-bottom: 1.0em;
   text-align: center;
}
div.archivedmaterial h2 {
   display: inline;
}
div.archivedmaterial img {
   padding-right: 0.6em;
   vertical-align: middle;
}
div.archivedmaterial p {
  padding-top: 0.6em; 
}

/* NEWS items */
div.news_item {
   border: 2px solid #e4e3e3;
   background-color: #ffffff;
   clear: both;
   float: left;
   width: 99.5%;
/*   margin-left: 1.2em;
   margin-right: 1.2em;
*/}
div.news_item h2.headline {
   font-weight: 400;
   border-bottom: 1px solid #e0e0e0;
   padding-bottom: 0.3em;
   padding-left: 0.6em;
   padding-top: 0.3em;
   background-color: #e4e3e3;
   color: #000000;
}
div.news_item img {
   margin-bottom: 0.4em;
   padding-left: 0.1em;
   padding-right: 0.1em;
   display: inline;
}

div.news_item .videoWrapper {
   position: relative;
   padding-bottom: 56.25%; /* 16:9 */
   padding-top: 25px;
   height: 0;
}

div.news_item .videoWrapper iframe {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
}

.img-float-left {margin-right: 20px;}

/* CSS for making Youtube iFrame responsive */

div.video-container {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 30px; 
height: 0; 
overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/* CSS for making Twitter iFrame responsive */

div.twitter-container {
position: relative;
padding-bottom: 0; /* */
padding-top: 600px; 
height: 50%; 
overflow: hidden;
}

.twitter-container iframe,
.twitter-container object,
.twitter-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


/* CSS for making HTML 5 video banners responsive */
/* experiment on /research/groups/culture-politics-justice/ - change to KPP 111021*/

div.video-container-html-banner {
position: relative;
padding-bottom: 45%; /* 16:9 */
padding-top: 0; 
height: 0; 
overflow: hidden;
}

.video-container-html-banner video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

/* CSS for highlight text */

mark.green {
  background-color: #00d2b9;
  color: black;
 font-style: normal;
	font-family: "Spectral", "myriad-pro", myriad, verdana, arial, sans-serif;
}

mark.bubblegum {
  background-color: #ff5a87;
  color: black;
 font-style: normal;
	font-family: "Spectral", "myriad-pro", myriad, verdana, arial, sans-serif;
}

mark.purple {
  background-color: #9655ff;
  color: white;
 font-style: normal;
	font-family: "Spectral", "myriad-pro", myriad, verdana, arial, sans-serif;
}

mark.yellow {
  background-color: #ebeb05;
  color: black;
 font-style: normal;
	font-family: "Spectral", "myriad-pro", myriad, verdana, arial, sans-serif;
}

/* CSS for the "Read More" buttons that show/hide paragraph content */
a.morelink {
display: table;
    text-decoration:none;
    outline: none;
    background-color: #0072CF;
    /*padding-top: 2em;*/
   margin-top: 0.5em;
    padding: 4px;
    color: #ffffff;
   font-size: 0.9em;
   float: right;
   margin-bottom: 0.3em;
}

a.morelink:hover {
display: table;
    text-decoration:none;
    outline: none;
	background-color: #000;}

.artcontent span {
    display: none;
}
.art {
    background-color: #ffffff;
    margin: 0px;
   margin-top: 0;
}
.inline {
   display: inline;
}
/* HOWTO : use <div class="art inline">{content}</div> */
/* END : "Read More" links */


/* RESEARCH pages from 2016-08-05 onwards */
div.research-typical-project {
   float: left; 
   width:95%;
   background-color: #ffffff;
   border: 1px solid #5D8AA8;
   border-top: 4px solid #5D8AA8;
   padding: 0.3em;
}
div.research-typical-project > div.research-typical-project-info-container {
   float: right;
   width: 71%;
}
div.research-typical-project > div.research-typical-project-info-container > div.maintext {
   width: 100%;
   border-bottom: 1px solid #5d8aa8;
}
div.research-typical-project > div.research-typical-project-info-container > div.pi {
   width: 99%;
   padding-top: 0.0em;
   float: left;
}
div.research-typical-project > div.research-typical-project-image-container {
   float: left;
   width: 28%;
   padding-right: 0.2em;
}
div.research-typical-project > div.research-typical-project-image-container img {
   border: 1px solid #e0e0e0;
}

table td.centered {
   text-align: center;
}

/* PEDAL Custom CSS for pedal/index.html 16/09/19 jlh208 */

   /* individual box text */
   .campl-theme-ff h2.campl-teaser-title.pedal {
   font-size: 1.5em;
   font-weight: 600;
   color: #3E3E3E;
   }
/* END */
/* individual small green link box with arrow 
.campl-focus-link.pedalgreen {
    width: 33px;
    height: 33px;
    background: #ffffff url(/images/template-images/icon-fwd-btn.png) 14px 13px no-repeat;
        background-color: rgb(49, 49, 49);
    position: absolute;
    bottom: 0;
    right: 0;
}*/
/* END */


.campl-theme-ff .campl-focus-link.pedalgreen {
    background-color: #A9B338;
}
.campl-theme-ff .campl-focus-link.pedallightblue {
    background-color: #01AEBF;
}
.campl-theme-ff .campl-focus-link.pedaldarkblue {
    background-color: #0272BA;
}
.campl-theme-ff .campl-focus-link.pedalpurple {
    background-color: #902C8E;
}