/* $Id: Spiral.css is the original theme for Spiral website, made by the Council of Europe, freely inspired from eatlon.css
*/

/* Import the default layout properties files: */
@import url("lite/lite.css");
@import url("layout/layout.css");
@import url("layout/design.css");

/* Import fonts */

@font-face {
    font-family: candela;
    src: url(Fonts/candela/CandelaBoldItalic.otf);
}

/*
@font-face {
    font-family: alegreyait;
    src: url(Fonts/AlegreyaSans-MediumItalic.ttf);
}*/

@font-face {
    font-family: alegreya;
    src: url(Fonts/ft_alegreya_norm.woff);
}

/*
@font-face {
    font-family: quattrocentoit;
    src: url(Fonts/QuattrocentoSans-Italic.ttf);
}


@font-face {
    font-family: quattrocento;
    src: url(Fonts/ft_quattrocento_norm.woff);
}
*/

@font-face {
    font-family: sourceit;
    src: url(Fonts/SourceSansPro-Italic.ttf);
}


@font-face {
    font-family: source;
    src: url(Fonts/ft_sourcereg.woff);
}


@font-face {
    font-family: sourcelight;
    src: url(Fonts/ft_source.woff);
}


/****
@font-face {
    font-family: "lato";
    src: url(Fonts/Lato-Medium.woff);
}
@font-face {
    font-family: "lato";
    src: url(Fonts/Lato-Heavy.woff);
    font-weight: bold;
}
@font-face {
    font-family: "lato";
    src: url(Fonts/Lato-MediumItalic.woff);
    font-style: italic;
}
@font-face {
    font-family: "lato";
    src: url(Fonts/Lato-HeavyItalic.woff);
    font-weight: bold;
    font-style: italic;
}
***/

/* Tiki 9 OLD */

.debug {
	color: #CCCCCC;
	background: #636363;
  padding: 1px 1em;
	font-size: 14px;
}

.debug:before {
	content: "debug info : ";
}

#sitelogo a,
#sitelogo a:visited,
#sitelogo a:hover {border-bottom: 0}

.floatright img {margin-right: 10px}

/* To enable pictures max-width: 100% in Firefox */

.fixedwidth {
	display: block !important;
}

.trackerfilteredit select, .trackerfilteredit textarea.wikiedit {
    max-width: 200px;
}

.regImage {
	max-width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
}

img.wrapRight {
	margin: 1em 2%;
	float: left;
}

img.wrapLeft {
	margin: 1em 2%;
	float: right;
}

/** Rule to put all images in autofit mode **/

#role_main img {
	height: auto;
	max-width: 100%;
	border-left: auto;
	border-right: auto;
}

/** To maintain openstreetmaps pictures ratio with autofit mode for pictures **/

#role_main .olTileImage {
	max-width: initial;
}

svg {
    max-width: 1000px;
    display: block;
    margin: auto;
}

.internal img {
	display: inline;
	Width: auto;
	Max-width: auto;
}

.siteloginbar_poppedup + .cluetip-close {
  border: 1px solid #9f0000;
  background-color: #ff5e5e;
  border-radius: 0 0 10px 10px;
	margin-top: -10px;
}

.siteloginbar_poppedup + .cluetip-close:hover {
	padding-top: 7px;
	transition: padding-top 0.2s; 
}

#top_modules .sitetitles {
/***    margin-left: 12%; ***/  /** With COE Logo **/
    margin-top: 1em;
    width: 58%;
}

.sitelogo img {
    margin-top: 1.2em;
}

#sitetitle {
	font-family: lato, serif;
	font-size: 320%;
	font-weight: 100; 
	text-shadow: 1px 1px 2px black; /* CSS3 property */
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#999999,direction=135,strength=3)
}
	
#sitetitle a,
#sitetitle a:visited {color: #FFF}

#sitetitle a:hover {
	color: #FFF;
	text-decoration: none;
	margin-top: 5%;
	margin-top: 5%;
	margin-bottom: 2%;
}

#sitesubtitle {
	font-size: 1em;
	font-style: italic;
	font-weight: 100;
	color: #FFF;
	text-shadow: 1px 1px 2px black; /* CSS3 property */
	margin-top: 1%;
	margin-bottom: 3%;
}
/* End of tiki 9 */

#top_modules img {
    width: 100%;
    height: auto;
    max-width: 129px;
}

#logoSPIRAL .regImage {
	max-width: 300px;
}

/***** Lang and User modules *****/

#module_14 form {
  width: 128px;
  overflow: hidden;
  height: 28px;
  border: 4px white;
  border: solid white 1px;
  margin-bottom: 4px;
	background: url("../img/icons/world.png") no-repeat 90% 50%;
	padding-left: 4px;
}

#module_14 select {
  height: 26px;
  border: none;
  background: none;
  color: white;
	font-size: 1.2em;
  font-weight: bold;
  padding-left: 4px;
	cursor: pointer;
	font-family: source, sans;
}

#module_3 {
  height: 28px;
  border: 4px white;
  border: solid white 1px;
  margin-bottom: 4px;
}

#module_3 .tabmark a {
  border: none;
  background: none;
  color: white;
  font-weight: bold;
	font-size: 1.4em;
  padding-left: 4px;
	padding-top: 5px;
	font-family: source, sans;
}



/***** XHTML Elements (body tag here,
			others follow Layout) *****/
body {
	font-family: lato, sans-serif;
	font-size: 76%/1.4em;
	background: #0c0033 url(spiral/SPIRAL_background.png) no-repeat ;
	background-position: 50% 0%;
	background-size: 102%;
	color: black;
}

html>body {
	font-size: 76%
}

body.fullscreen {
	padding: 3em
}


body {
	margin-bottom: 20px;
	padding: 0 6% 0 6%;
	width: 88%;
}

@media (max-width: 1500px) {
	body {
		padding: 0;
		width: 100%;
	}
}

@media (max-width: 800px) {
	body {
	  background: #0c0033;
    background: linear-gradient(to bottom right, #3b26bf, #433897, #433897, #010031, #010031, #010031);
	}
}

body.fixed_width *:first-child+html #c1c2 {
	margin-left: 0;
	padding-left: 0}
	
body.fixed_width #main[id] {
	margin-bottom:0;
	margin-top: 0;
}

 /***** Layout (overrides layout.css;
		also styling of page layout divs)  *****/
		
/* Enable header and footer content to widen when middle has wide content. */ 

body.fixed_width .fixedwidth .fixedwidth {
	padding: 0;
}

body.middle_outer{
	margin-top: 10%;
	margin-left: 2.5%;
	width: 95%;
}

#middle {
	text-align: left;
	min-height: 450px;
/*	background: #fff;*/
	margin-bottom: 0;
}

p .editdate, p.related {
	text-align: right;
}

#comment-container {
	border:1px solid #f7f1fe;
        padding-top: 10px;
        padding-bottom: 10px;
        margin-top: 20px;
        margin-bottom: 20px;
        border-radius:10px;
        -moz-border-radius:10px; /* Old Firefox */
	background-color: #f7f1fe;
}

#c1c2 #wrapper #col1.marginleft  {
	margin-left: 180px;
	border-left: 1px solid #B90F00;
}

/*#c1c2 #wrapper #col1.marginright {
	margin-right: 180px;
}*/

#c1c2 #col2 {
	width: 180px;
	overflow: visible;
	border-right: 1px solid #B90F00;
}

#c1c2 {
	background: #ffffff;
}

#col2 .content {padding: 20px 20px}

#col1 #tiki-center {
	padding: 0 30px}

article {
    font-size: 1.1em;
    line-height: 1.4em;
}

p {
	display: block;

}

article p {
    font-size: 1.1em;
    line-height: 1.4em;
		margin: 0 0 1em 0;
}

#footer {
	min-height: 163px
}

.related {
	border:1px solid #b90f00;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: 20px;
	margin-bottom: 20px;
	border-radius:10px;
	-moz-border-radius:10px; /* Old Firefox */
}


.related h4 {
	text-align: center;
	padding: 0px 10px 10px 10px;
	border-bottom: 1px solid #b90f00;
}

.related li {
	display: block;
}

.footerbgtrap {
	min-height: 163px;
}

#bottom_modules {
  color: #a2a2a2;
	min-height: 163px;
	text-align: center;
  font-size: 1.4em;
}

#bottom_modules #module_64 {
  background-color: #65578a;
  background-color: rgba(37, 29, 59, 0.7);
  background-color: #251d3bb3;
}

#bottom_modules #module_64 a {
  color: #a2a2a2;
  color : #a2a2a2;
}

#module_64 h3 {
	border-style: none;
}

.error,
.errorspiral,
.errors {
	color: #cd0a0a;
	border:1px solid #cd0a0a;
	background: #fef1ec;
}

.errorfill {
	color: red;
	float: left;
	font-family: monospace;
	font-size:1.1em;
	line-height:1.3em;
	white-space:nowrap;
}


/********** CSS3 multicolumn **********/

.multicol {
	-moz-column-count: 2;
	-moz-column-gap: 4vw;
	-webkit-column-count: 2;
	-webkit-column-gap: 4vw;
	column-count: 2;
	column-gap: 4vw;
}	

.multicol p:first-child{
	margin-top: 0px;
}

@media (max-width: 960px) {
.multicol {
	-moz-column-count: 1;
	-moz-column-gap: 4vw;
	-webkit-column-count: 1;
	-webkit-column-gap: 4vw;
	column-count: 1;
	column-gap: 4vw;
}
}

@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) 
  and (orientation: portrait) {
    .multicol {
    -moz-column-count: 1;
    -moz-column-gap: 4vw;
    -webkit-column-count: 1;
    -webkit-column-gap: 4vw;
    column-count: 1;
    column-gap: 4vw;
	}                                                                               
}

/* custom spiral jquery validation */

label.errorspiral {
	background : url('../../img/icons/error.png') no-repeat;
	color:red;
	padding-left:20px;
	margin-left: 0.5em;
}

/***** XHTML Elements (other than body tag) ******/



a,
a:link,
a:visited {
	text-decoration: none;
	color: blue;
}
	
* html a,
* html a:link,
* html a:visited {border-bottom: 1px solid #fff}

#page-data .articletitle h1 a:visited,
#page-data .articletitle h1 a,
#page-data .articletitle h2 a:visited,
#page-data .articletitle h2 a {
	color: #000000;
}

a:hover a:active a:focus {
	text-decoration: none;
	color: blue;
}


.titlebar {
    border: none;
    font-family: alegreya, sans-serif;
    color: #B11155;
    font-size: 2.3em;
		padding: 1em 0 1em 0;
		line-height: 1.2em;
		text-align: center;
}

.titlebar2 {
    border: none;
    font-family: alegreya, sans-serif;
    color: #4700AD;
    font-size: 2em;
		padding: 0 0 1em 0;
		line-height: 1.2em;
		text-align: center;
}

.tcorfrtitle {
	font-family: source, sans-serif;
	font-size: 2.4em;
	font-color: #200041;
	line-height: 110%;
	padding: 18px 0 0 0;
}

.tcorfrtitle:hover {
	color: #7F73C9;
	transition: color 0.4s ease-out 0s, color 0.4s ease-out 0s;
}

.tcorfr {
	font-family: source, sans-serif;
	font-size: 2em;
	font-color: #200041;
	line-height: 110%;
	padding: 11px 0 0 0;
}

.tcorfr:hover {
	color: #CC6600;
	transition: color 0.4s ease-out 0s, color 0.4s ease-out 0s;
}

h1 {
    clear: both;
    font-family: alegreya, sans-serif;
    font-size: 1.4em;
    line-height: 1em;
    color: #30247A;
    padding: 0.2em 2em 0.5em 2em;
		margin: 0;
}

h2, h3, h4, h5 {
	font-family: lato, sans-serif;
	font-color: #200041;
	padding: 0.5em 3em;
}

h2 {
	font-size: 1.2em;
	margin: 1em 0 0.6em 0;
	background: none;
	padding: 0;
	font-family: alegreya, sans-serif;
	color: #524295;
	font-size: 1.30em;
	/* line-height: 1em; */
	padding: 0.5em 0 0.2em 0;
	margin: 0;
}

h3 {
	font-size: 1em;
	padding: 0;
	margin: 1em 0 0.6em 0;
}

h4 {
	font-size: 1em;
	padding: 0;
	margin: 1em 0 0.6em 0;
}

h5 {
	font-size: 1em;
	color: #032936}

hr {
	color: #8cacbb}


.two-col {
    -moz-column-count: 2;
    -moz-column-gap: 4em;
   	-webkit-column-count: 2;
		-webkit-column-gap: 4em;
  	column-count: 2;
		column-gap: 4em;
    text-align: justify;
}

.three-col {
    -moz-column-count: 3;
    -moz-column-gap: 4em;
   	-webkit-column-count: 3;
		-webkit-column-gap: 4em;
  	column-count: 3;
		column-gap: 4em;
    text-align: justify;
}

fieldset {
	border: solid 1px #af76bf;
	padding: 10px;
	background: white;
	border-radius: 12px;
}

legend {
	color: #5b008a;
}

textarea, body.cke_show_borders {
    background: #faf1ff;
    color: #2c2c2c;
    border: 1px solid #af76bf;
    padding: 0 20px;
}

textarea:focus,
body.cke_show_borders {
	background: white;
	color: black;
}

.textarea-toolbar > div {
    background-color: #fff;
    border: solid #af76bf 1px;
    height: 2.3662em;
    border-radius: 12px;
    margin-bottom: 2px;
}

.toolbar-list {
    padding: 0 0 0 .5em;
    line-height: 20px;
    border-left: medium double #af76bf;
}

.edit-zone img:hover {
    padding-bottom: 4px;
}

.wikiplugin_articles:hover {
	border-radius: 25px;
	background-color:#fff1ed
}

.ListArticles h1 {
	display: none;
}

.ListArticles .titleb {
	display: none;
}

#ArticlesFloat {
	clear: both;
}

.padding-left {
	padding-left: 2em;
}
.padding-right {
	padding-right: 2em;
}

.ListArticles .articletitle {
	margin: 0 0 0 0;
}

#rss br {
	display: none;
}

#rss {
	padding: 0;
}

#pagetop_modules #module_63 h3 {
	display: block;
	width: auto;
	float: left;
	padding: 0;
	margin: 0;
	font-size: 1.1em;
	border: none;
	color: black;
	font-weight: bold;
}

#page-data .InfopageArticle .wikiplugin_articles { 
	width: 100%;
}

#page-data .InfopageArticle .wikiplugin_articles .articletitle { 
	display: none;
}

input[type=checkbox],
input[type=radio] {border: 0}

/* Button box */
button,
.button a,
.button a:hover,
button a,
button a:hover,
input[type="reset"],
input[type="submit"],
input[type="reset"]:hover,
input[type="submit"]:hover, 
button[type="submit"],
button[type="submit"]:hover {
  display: inline-block;
  margin: 1px 2px;
  padding: 0.1em 0.6em 0.1em 0.6em;
  background: none repeat scroll 0 0 #f0e5f3;
  border: none;
  border-radius: 5px 5px 5px 5px;
}


/* Button text */
button,
.button a,
button a,
.button span a,
button span a,
.button a a,
button a,
input[type="reset"],
input[type="submit"],
input[type="reset"]:hover,
input[type="submit"]:hover,
button[type="submit"],
button[type="submit"]:hover {
  font-family: open, sans-serif;
  font-size: 1em;
  color: #5b008a;
}

/* :hover specifics */
.button:hover a,
input[type="submit"]:hover, 
button[type="submit"]:hover {
  color: #771fa4;
	box-shadow: inset 0px 0px 3px #ded0ec;
}

/* Needed for Opera (11) */
input[type="reset"],
input[type="submit"],
input[type="reset"]:hover,
input[type="submit"]:hover,
button[type="submit"],
button[type="submit"]:hover {
	padding: 0 3px;
}

/*span.button { /*Override buttons (causes layout inconsistencies)*/
/*	margin: 2px;
}*/

select[name="theme"] {width: 135px}

label {cursor: pointer}


tt {font-size: 1.2em}

.hidebullets li {
	list-style: none;
}

/******* jquery ui *******/

.ui-widget-content {
    border: none;
    background: #FFF;
    color: #4C428A;
}

.cluetip-default .ui-cluetip-header {
    background-color: #FFF;
}

.ui-widget-header {
    border: none;
    background: none;
    color: #342D60;
    font-weight: bold;
}

.cluetip-close {
    float: right;
    margin: 0px;
    background: none repeat scroll 0% 0% transparent;
    color: #900;
    padding: 0 0 0 0;
}

.ui-cluetip-content h3 {
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

#main ul.siteloginbar_poppedup, 
#main ul.siteloginbar_poppedup .tabcontent {
    background: none repeat scroll 0% 0% #FFF;
    border: none;
		box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.5);
}


#main ul.siteloginbar_poppedup .tabcontent a {
		font-size: 1.1em;
}



/***** Site Header & Identity *****/

/**********  Cleaning Tiki layout.css base styles for SPIRAL   ***************/


.fixed_width .fixedwidth, .fixed_width .fixedwidth .fixedwidth {
	width: 100%;
}

#top_modules {
	height: 100px;
	padding: 0 2%;
}

#top_modules .box-login_box {
	position: static;
}

#top_modules .tabmark {
	padding: 0px;
	margin: 0px;
	background: transparent;
	width: auto;
}

#top_modules .tabmark a {
	padding-right: 1em;
	padding-left: 1em;
}

#module_2 {
	width: 60%;
	text-align: left;
}

#module_60 {
	width: 40%;
	text-align: right;
	float: left;
}

#module_3 {
	margin-top: 16px;
	width: auto;
	float: right;
}

#module_14 {
	margin: 16px 10px 0 0;
	width: auto;
	float: right;
}

#mod-switch_langt3 {
	display: block;
	float: right;
	margin-top: 15px;
	clear: right;
}

#module_3 #mod-login_box .box-login_box {
	clear: right;
	display: block;
	float: right;
	width: 15%;
	margin-top: 15px;
}


.header_container .fixedwidth {
	text-align: left;
/*	min-height: 126px;*/
	margin-bottom: 0;
}

#top_modules {
	min-height: 120px;*/
}

#top_modules .module.secondary_site_menu {
	position: absolute;
	top: 0;
	right: 30px;
}

#mod-quickadmint3 {
	color: #fff;
}

#top_modules .secondary_site_menu .cssmenu_horiz li ul {
	margin-top: -6px;
}

#top_modules .secondary_site_menu .cssmenu_horiz li ul ul {
	margin-top: 0;
}

#top_modules .box-logo {
	float: left;
}

.sitetitle {
	font-family: georgia, serif;
	font-size: 5em;
	font-weight: 100; 
	text-shadow: 1px 1px 2px black; /* CSS3 property */
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#999999,direction=135,strength=3)
}

@media (max-width: 400px) {
  .sitetitle {
	  font-size: 2.2em;
  }
  .sitesubtitle {
	  font-size: 0.8em;
  }
}

.sitetitle a,
.sitetitle a:visited {
	color: #FFF;
	font-family: source;
}

.sitetitle a:hover {
	color: #FFF;
	text-decoration: none;
	margin-top: 5%;
	margin-top: 5%;
	margin-bottom: 2%;
}

.sitesubtitle {
	font-size: 1.4em;
	font-style: italic;
	font-weight: 100;
	color: #FFF;
	text-shadow: 1px 1px 2px black; /* CSS3 property */
	margin-top: 1%;
	margin-bottom: 3%;
}

#mod-switch_langt1{
	text-align: right ;
}

input[id="sl-login-user"],
input[id="sl-login-pass"] {background: #e1e1e2}

.siteloginbar input.wikiaction {cursor: pointer}

.siteloginbar_popup {
	bottom: 2px;
}

.siteloginbar_popup ul ul {
	margin-top: -6px;
}

.siteloginbar_popup .tabcontent a,
.siteloginbar_popup .tabcontent a:visited,
.siteloginbar_popup label {
	color: #blue;
}

#logout_link_1 .siteloginbar_poppedup 
#logout_link_1 .siteloginbar_poppedup a:hover {
	color: blue;
}

body .middle_outer {
	clear: both;
}


@media (max-width: 800px) {
  #module_62 .menuSection0 {
    max-width: 20%;
  }
  #module_62 .menuSection0 a {
    font-size: 1.2em;
  }
  #module_62 li.option835 {
    width: 10%;
  }
  
  #module_62 li.option834 {
    width: 10%;
  }
}

@media (max-width: 400px) {
  #module_62 .menuSection0 a {
    font-size: 4vw;
  }
  #module_3, #module_14 {
    margin: 2px 0 0 0;
  }
}

@media (max-width: 600px) {
  #module_3, #module_14 {
    margin: 2px 0 0 0;
  }
}

#mod-logotop1 {
  width: 100%;
}

.sitelogo {
  width: 20%;
}


.sitetitle {
  width: 100%;
}

/******* SPIRAL NEW HOMEPAGE ***********/

.home_intro {
		clear: both;
}

.spiral_home br {
    clear: both;
}

.spiral_home .titlebar {
    border: none;
    font-family: alegreya, sans-serif;
    color: #B11155;
    font-size: 2.3em;
		padding: 0 0 0 0;
}

.spiral_home .titlebar:hover {
    background: none;
}

.spiral_home .wpfade-plugin {
	float: left;
	clear: both;
	width: 100%;
}

.desc_text {
    font-size: 1.6em;
    font-family: source, sans-serif;
    line-height: 1.6em;
    color: #95427A;
}

.desc_text .wpfade-div-plain {
		clear: both;
}

.home_act {
		float: left;
		width: 15%;
		margin-top: 2em
}

.spiral_home .fb {
		clear: both;
    float: left;
    width: 5%;
		margin-top: 2em
}

.vimeo {
    float: left;
		width: 64%;
		padding: 0 3% 0 13%;
}

.fb .twitter-wikispiral {
	font-family: arial, sans;
  width: 50px;
  background: rgb(12, 161, 242) url("../img/twitter-white.png") no-repeat;
  color: white;
  background-size: 18px;
  background-position: 8% 50%;
  border-radius: 5px;
  padding: 1px 4px 1px 26px;
  white-space: nowrap;
  margin: 20px 0 20px 0;
  display: block;
}

.twitter-follow-button {
		width: 100%;
		padding: 1em 0 2em 0;
}

.flickr {
		padding: 0 0 2em 0;
}

.fb_iframe_widget {
		width: 100%;
		padding: 0 0 2em 0;
}

.spiral_home .home_act .login_link {
    border: medium none;
    background: none repeat scroll 0% 0% transparent;
    font-family: source,sans-serif;
    font-size: 1.5em;
    padding: 0px 0px 0px 5%;
    font-weight: normal;
}

.spiral_home #logout_link_1, .spiral_home .tabmark, .spiral_home .login_link {
    width: 100%;
}

.siteloginbar_popup .tabmark a:after {
		display: none;
}

.home_act a.ajaxtips {
    border: none;
    background: none;
    font-family: source, sans-serif;
    font-size: 1.3em;
    padding: 0 0 0 5%;
    line-height: 1.6em;
}

.join_us .toc {
    border: none;
    border: none;
    background: none;
    font-family: source, sans-serif;
    font-size: 1.3em;
    padding: 0 0 0 1em;
    line-height: 1.3em;
}

.home_act form {
    margin: 2em 0 0 3em;
}

@media (max-width: 1100px) {
  
  .spiral_home .fb {
    width: 100%
  } 

  .spiral_home .fb h2 {
    float: left;
    width: auto;
    clear: none;
    margin: 0 2% 0 2%;
    padding: 0;
  }

  .spiral_home .fb iframe {
    float: left;
    width: auto;
    clear: none;
    margin: 0 2% 0 2%;
    padding: 0;
  }

  .spiral_home .fb .flickr {
    float: left;
    width: auto;
    clear: none;
    margin: 0 2% 0 2%;
    padding: 0;
  }

  .spiral_home .fb .fb-like {
    float: left;
    width: auto;
    clear: none;
    margin: 0 2% 0 2%;
    padding: 0;
  }

  .spiral_home .fb .fb-vimeo {
    float: left;
    width: auto;
    clear: none;
    margin: 0 2% 0 2%;
    padding: 0;
  }
  
  .vimeo {
    clear: both;
    width: 100%;
    padding: 0;
    margin: 2em 0 0 0;
  }
  
  .home_act {
    width: 100%;
  }
}

.wpfade-plugin {
	float: left;
	clear: both;
	width: 100%;
}

.wpfade-plugin::after {
	content: "";
	clear: both;
}

.wpfade-span-plain {
	display: block;
	width: max-content;
	background: rgb(135, 123, 214);
	padding: 0.4em 0.8em;
	border-radius: 0.6em;
	margin: 1px;
}

.wpfade-span-plain a, .wpfade-span-plain a:link, .wpfade-span-plain a:visited {
	color: white;
}

.titlebar {
	clear: both;
	width: 100%;
	padding: 0.4em 0;
}


/** News Boxes listings **/

#page-data .TextBox h2 {
    clear: none;
}


.TextBox img {
	clear: both;
	float: left;
	width: 30%;
	margin-right: 5%;
}

.TextBox .icon {
	width: auto;
}

.TextBox h2{
	float: left;
	width: 65%;
}
 
.TextBox .BoxText {
	float: left;
	width: 65%;
} 

.TextBox {
    display: inline-block;
    width: 100%;
}

.TextBox {
	display: inline-block;
	width: 100%;
	margin: 0 0 2em 0;
} 


@media (max-width: 800px) {
  #page-data  .TextBox h2 {
    clear: both;
    width: 100%;
    margin-top: 1em;
  }
  
  #page-data .TextBox img {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    display: block;
  }
  
  #page-data .BoxText {
    width: 100%;
  }
}


/*** Slider paradigm shift ***/

.spiral_home h1,
.home_slider .paradigm_slider,
.home_slider .answer_slider, 
.spiral_home .partners {
    clear: both;
		font-family: alegreya, sans-serif;
    font-size: 2.3em;
    line-height: 1em;
    color: #08003C;
		text-align: center;
		padding: 1em 2em 1em 2em;
		background-color: #D8D3FE;
		margin: 1em 0;
}

.accordion > li {
		width: 16.666%;
		transition:width 500ms;
}


.accordion > li.toggle_small.toggle_big {
		width: 45%;
		transition:width 500ms;
}

.accordion > li.toggle_small {
		width: 10.92%;
		transition:width 500ms;
}

ul.accordion {
  list-style-type: none;
  position: relative;
  top: 0;
  font-family: candela, sans-serif;
  font-size: 16px;
  font-style: italic;
  line-height: 1.5em;
	padding: 0 0 0 0;
}

ul.accordion li {
  float: left;
  height: 320px;
  display: block;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
	box-sizing: border-box;
	moz-box-sizing: border-box;
	webkit-box-sizing: border-box;
  background: #fff;
  background-repeat: no-repeat;
  background-position: center center;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  -webkit-box-shadow: 1px 3px 5px #555;
  -moz-box-shadow: 1px 3px 5px #555;
  box-shadow: 1px 3px 5px #555;
}

ul.accordion li.bg1 { background-image: url("spiral/progress2.jpg"); }
ul.accordion li.bg2 { background-image: url("spiral/democracy2.jpg"); }
ul.accordion li.bg3 { background-image: url("spiral/facilitator.jpg"); }
ul.accordion li.bg4 { background-image: url("spiral/knowledge.jpg"); }
ul.accordion li.bg5 { background-image: url("spiral/economy.jpg"); }
ul.accordion li.bg6 { background-image: url("spiral/society.jpg"); }

ul.accordion li.bleft { border-left: 2px solid #fff; }

ul.accordion li .heading {
  background: #fff;
  padding: 0.3em;
  margin-top: 2em;
  opacity: 0.8;
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1px;
  font-size: 0.9em;
  color: #3E3E3E;
  text-align: center;
  text-shadow: -1px -1px 1px #D4D4D4;
	transition:opacity 500ms; 
}

ul.accordion li.toggle_big .heading {
	opacity: 0;
	transition:opacity 500ms; 
}

ul.accordion li .description {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
	height: 7.6em;
	opacity: 0;
	transition: opacity 500ms;
}

ul.accordion li.toggle_big .description {
	opacity: 100;
	transition: opacity 500ms;
}

ul.accordion li .description h2 {
  font-family: candela, sans-serif;
	text-transform: uppercase;
  font-style: normal;
  font-weight: bold;
  letter-spacing: 1px;
  font-size: 1.2em;
  color: #1D1144;
  text-align: left;
  margin: 0px 0px 0.2em 0; 
  text-shadow: -1px -1px 1px #ccc;
	padding: 0 1em 0 1em;
}



ul.accordion li .description p {
	color: black;
  margin: 0 0 10px 8px;
  font-family: source, sans-serif;
  font-size: 1em;
  font-style: italic;
  font-weight: normal;
  text-transform: none;
  letter-spacing: normal;
  line-height: 1.2em;
}

.home_slider ul.accordion li .description a {
  position: absolute;
  bottom: 5px;
  left: 20px;
  text-transform: uppercase;
  font-style: normal;
  font-size: 1em;
  text-decoration: none;
  color: #888;
	opacity: 0;
}

.home_slider ul.accordion li.toggle_big .description a {
	opacity: 100;
}

.home_slider ul.accordion li .description a:hover, .home_slider ul.accordion li .description a:active, .home_slider ul.accordion li .description a:active {
  color: #333;
  text-decoration: underline;
}

ul.accordion li .bgDescription {
  background: linear-gradient(0deg, #fff 1%, rgba(255,255,255,0));
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 0;
	transition:height 500ms;
}

ul.accordion li.toggle_big .bgDescription {
	height: 18em;
	transition:height 500ms;
}

/*** Slider Homepage news ***/


.home_news_slider {
	width: 76%;
	height: 400px;
	margin: 0 2% 0 2%;
	float: left;
}


/*****  First slide behaviour  ******/

.home_news_slider .slnews > li.slnews1,
.home_news_slider .slnews > li.slnews1.toggle_big.toggle_small {
	width: 70%;
	transition:width 500ms;
	background-size: cover;
}

.home_news_slider .slnews > li.slnews1 .heading,
.home_news_slider .slnews > li.slnews1.toggle_big.toggle_small  .heading {
	opacity: 0;
	transition:opacity 500ms; 
}

.home_news_slider .slnews > li.slnews1 .description,
.home_news_slider .slnews > li.slnews1.toggle_big.toggle_small  .description {
	opacity: 100;
	transition:opacity 500ms; 
}
	

.home_news_slider ul.slnews li.slnews1 .bgDescription,
.home_news_slider ul.slnews li.slnews1.toggle_big.toggle_small  .bgDescription {
	height: 18em;
	transition:height 500ms;
}

.home_news_slider .slnews > li.slnews1.toggle_small {
	width: 10%;
	transition:width 500ms;
}

.home_news_slider .slnews > li.slnews1.toggle_small .heading {
	opacity: 100;
	transition:opacity 500ms; 
}

.home_news_slider .slnews > li.slnews1.toggle_small .description {
	opacity: 0;
	transition:opacity 500ms; 
}
	

.home_news_slider ul.slnews li.slnews1.toggle_small .bgDescription {
	height: 0em;
	transition:height 500ms;
}



/***** Rest of the slides *****/

.home_news_slider .slnews > li {
		width: 10%;
		transition:width 500ms;
}

.home_news_slider .slnews > li.toggle_small.toggle_big,
.home_news_slider .slnews > li.toggle_small.toggle_big:first-child {
		width: 70%;
	  background-size: cover;
		transition:width 500ms;
}

.home_news_slider .slnews > li.toggle_small {
		width: 10%;
		transition:width 500ms;
}

.home_news_slider ul.slnews {
  list-style-type: none;
  position: relative;
  top: 0;
  font-family: candela, sans-serif;
  font-size: 16px;
  font-style: italic;
  line-height: 1.5em;
	padding: 0 0 0 0;
	background-size: cover;
}

.home_news_slider ul.slnews li {
  float: left;
  height: 400px;
  display: block;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
	box-sizing: border-box;
	moz-box-sizing: border-box;
	webkit-box-sizing: border-box;
  background: #fff;
  background-repeat: no-repeat;
  background-position: center center;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  -webkit-box-shadow: 1px 3px 5px #555;
  -moz-box-shadow: 1px 3px 5px #555;
  box-shadow: 1px 3px 5px #555;
}

.home_news_slider ul.slnews li.slnews1 { background-image: url("spiral/slnews2.jpg"); }
.home_news_slider ul.slnews li.slnews2 { background-image: url("spiral/TCOR4Braine_Photowall.png"); }
.home_news_slider ul.slnews li.slnews3 { background-image: url("spiral/slnews3.jpg"); }
.home_news_slider ul.slnews li.slnews4 { background-image: url("spiral/slnews4.jpg"); }

.home_news_slider ul.slnews li.bleft { border-left: 2px solid #fff; }

.home_news_slider ul.slnews li .heading {
  background: #fff;
  padding: 0.3em;
  margin-top: 2em;
  opacity: 0.8;
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1px;
  font-size: 0.9em;
  color: #3E3E3E;
  text-align: center;
  text-shadow: -1px -1px 1px #D4D4D4;
	transition:opacity 500ms; 
}

.home_news_slider ul.slnews li.toggle_big .heading {
	opacity: 0;
	transition:opacity 500ms; 
}

.home_news_slider ul.slnews li .description {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
	height: 40%;
	opacity: 0;
	transition: opacity 500ms;
}

.home_news_slider ul.slnews li.toggle_big .description {
	opacity: 100;
	transition: opacity 500ms;
}

.home_news_slider ul.slnews li .description h2 {
  font-family: candela, sans-serif;
	text-transform: uppercase;
  font-style: normal;
  font-weight: bold;
  letter-spacing: 1px;
  font-size: 1.2em;
  color: #1D1144;
  text-align: left;
  margin: 0px 0px 0.4em 0; 
  text-shadow: -1px -1px 1px #ccc;
	padding: 0 1em 0 1em;
}



.home_news_slider ul.slnews li .description p {
	color: black;
  margin: 0 0 10px 8px;
  font-family: source, sans-serif;
  font-size: 1em;
  font-style: italic;
  font-weight: normal;
  text-transform: none;
  letter-spacing: normal;
  line-height: 1.2em;
}

.home_news_slider ul.slnews li .description .readMore {
  position: absolute;
  bottom: 5px;
  left: 20px;
  text-transform: uppercase;
  font-style: normal;
  font-size: 1em;
  text-decoration: none;
  color: #888;
	opacity: 0;
}

.home_news_slider ul.slnews li.toggle_big .description .readMore {
	opacity: 100;
}

.home_news_slider ul.slnews li .description .readMore:hover, .home_news_slider ul.slnews li .description .readMore:active, .home_news_slider ul.slnews li .description .readMore:active {
  color: #333;
  text-decoration: underline;
}

.home_news_slider ul.slnews li .bgDescription {
  background: linear-gradient(0deg, #fff 1%, rgba(255,255,255,0));
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 0;
	transition:height 500ms;
}

.home_news_slider ul.slnews li.toggle_big .bgDescription {
	height: 18em;
	transition:height 500ms;
}

/*** For small screens ***/


@media (max-width: 800px) {
  
  .home_news_slider {
  width: 96%;
  height: auto;
  }
  
  .home_news_slider .slnews > li,
  .home_news_slider .slnews > .slnews1  {
  width: 100% !important;
  clear: both;
  margin-bottom: 2em;
  }
  
  .home_news_slider .slnews > li .heading,
  .home_news_slider .slnews > li.toggle_big.toggle_small .heading,
  .home_news_slider .slnews > li.toggle_small .heading {
	  opacity: 0!important;
  }
  
  .home_news_slider .slnews > li .description,
  .home_news_slider .slnews > li.toggle_big.toggle_small .description {
	  opacity: 100!important;
  }
  
	.home_news_slider ul.slnews li .bgDescription,
	.home_news_slider ul.slnews li.toggle_big.toggle_small  .bgDescription {
		height: 18em!important;
  }
}

@media (max-width: 1100px) {
	.home_news_slider {
		clear: both;
		width: 100%;
    margin: 0;
	}
}

/*** Website plan ***/

.approach, .together, .learn-act, .results {
    float: left;
    width: 23.5%;
    margin: 0 2% 0 0;
    box-shadow: 0px 0px 3px #2C006C;
}

.approach:hover, .together:hover, .learn-act:hover, .results:hover {
    box-shadow: 0px 0px 12px #2C006C;
}


.mini-menu {
    float: left;
    width: 100%;
		margin: 0 0 2em 0;
}

.mini-menu > div > ul {
   min-height: 12em;
}

.mini-menu > div > ul > li {
    padding-left: 1.6%;
}

.spiral_home ul >li > ul {
	display: none;
}

.results {
		margin : 0;
}

.mini-menu .regImage {
    width: 100%;
    height: auto;
}

.partners {
   padding: 0 1.6%;
   clear: both;
}


.mini-menu a.wiki_page {
	font-family: alegreya, sans-serif;
	color: #29108A;
	font-size: 2.4em;
	font-size: 2.4vw;
	display: block;
	padding: 4em 5% 1em 4.5%;
	line-height: 1em;
	height: 2em;
	text-shadow: 1px 1px 5px #4F468A;
}

.mini-menu > div > ul > li > div > a {
	position: relative;
	left: 10px;
}

.mini-menu .toc {
	font-family: source,sans-serif;
	font-size: 1.2em;
	font-size: 1.4vw;
	line-height: 1.2em;
	line-height: 1.6vw;
	border: none;
	padding: 0 1em 0 0;
}

.mini-menu .approach > a {
    background: linear-gradient(to bottom, transparent 0%, rgba(252, 252, 252, 0.88) 68%, rgba(255, 255, 255, 0.88) 100%) repeat scroll 0% 0%, url("spiral/bg_logo.png") no-repeat scroll top center;
}

.mini-menu .together > a {
    background: linear-gradient(to bottom, transparent 0%, rgba(252, 252, 252, 0.88) 68%, rgba(255, 255, 255, 0.88) 100%) repeat scroll 0% 0%, url("spiral/bg_together.jpg") no-repeat scroll top center;
}

.mini-menu .learn-act > a {
    background: linear-gradient(to bottom, transparent 0%, rgba(252, 252, 252, 0.88) 68%, rgba(255, 255, 255, 0.88) 100%) repeat scroll 0% 0%, url("spiral/bg_meeting.jpg") no-repeat scroll top center;
}

.mini-menu .results > a {
    background: linear-gradient(to bottom, transparent 0%, rgba(252, 252, 252, 0.88) 68%, rgba(255, 255, 255, 0.88) 100%) repeat scroll 0% 0%, url("spiral/bg_stats.png") no-repeat scroll top center;
}

.mini-menu > div > ul > li > div > a:hover::after {
	content: "›";
	color: #E47EB1;
	position: absolute;
	left: -8px;
	top: 0;
	font-size: 1.2em;
	font-size: 1.4vw;
}

/*** Logos ***/

.partners_logo .regImage {
    width: 100px;
    height: auto;
    margin-right: 10px;
		float: left;
}

/******* SPIRAL OLD HOMEPAGE ***********/

#page-data .wikiplugin_articles {
	display: block;
	width: 360px;
	float: left;
	margin: 1px 1px 1px 1px;
	padding: 10px 10px 40px 10px;
}


#page-data h1,
#page-data h2 {
	clear: both;
}

#page-data #News h1,
#page-data #News h2 {
	clear: none;
}

#page-data .wikiplugin_articles td:last-child {
   display: block;
   float: left;
   padding: 2%;
}

#page-data .wikiplugin_articles td:first-child {
	display: block;
	float: left;
	padding: 2%;
} 


#page-data #News h1 {
	display: none;
}

#page-data .articleimage {
	max-width: 100%;
}



/******** Sub-homepages ********/

/* Démarche page */

.TwoColTable table { 
	border-collapse: collapse; 
}

.TwoColTable tr { 
	border: none; 
}

.TwoColTable td:first-child {
  border-right: solid 1px #ddd; 
}

/***********  MENUS SPIRAL  ****************/

/*********** New menus ***********/

/**** Hides the submenus (not doable in php because of bug) ****/

#role_main .tabcontent {
	z-index: initial;
}

#module_62 ul > li > ul {
    visibility: hidden;
}

/***** Fixed menus *****/


#topbar_modules.fixed {
		position: fixed;
		top: 0;
		z-index: 1000;
		background: #382F88;
		width: 88%;
		left: 0px;
		left: 0px;
		padding: 0px 6%;
}


#pagetop_modules.fixed {
    position: fixed;
    top: 40px;
    left: 0px;
    z-index: 100;
    background: none repeat scroll 0% 0% #fff;
    width: 98%; /* Magic number to temp correct jquery appendTo() */
    min-height: 40px;
    padding: 1em;
    margin: 0;
}

/***** Correction of # anchors offset under fixed menu *****/
/***** See also below plus resulting bug corrections *****/
#role_main h1, 
#role_main h2,
#role_main h3,
#role_main h4,
#role_main h5 {
	margin-top: -100px;
	padding-top: 100px;
}

h1::before,
h2::before,
h3::before {
    content: "";
    display: block;
    height: 12px;
}

/** Needed to avoid having the anchor correction not overlaying **/
.icon_edit_section {
	float: none;
	display: inline;
}

/** Needed to avoid anchor offset correction overlap navigation sections **/
#role_main .navbar {
	z-index: 1;
	position: relative;
}

#topbar_modules {
	z-index: 1;
	position: relative;
}

#role_main .pagetitle, #role_main .titletips {
	z-index: 1;
	position: relative;
}

/** Needed to avoid messing up some titles used in smaller areas **/
#role_main .tracker1output h1, #role_main .tracker1output h2, #role_main .tracker1output h3, #role_main .tracker1output h4, #role_main .tracker1output h5, #role_main .home_act h2  {
	margin-top: 0;
	padding-top: 0;
}

/**** Increase select dimensions for comfort ****/
.tabcontent #groups_inc {
	height: 400px;
}

#module_62 .role_navigation a {
	border-top: 1px solid transparent;
	border-left: 1px solid transparent;
	border-right: 1px solid transparent;
}

#module_62 .role_navigation a:hover, #module_62 .role_navigation a:focus, #module_62 .role_navigation a:active {
  border-top-right-radius: 1em;
  border-top-left-radius: 1em;
  border-width: 1px;
  border-top-style: solid;
  border-left-style: solid;
  border-right-style: solid;
  border-top-color: #FFF;
  border-left-color: #FFF;
	border-right-color: #FFF;
	transition: border-top 1s ease-out 0s, border-left 1s ease-out 0s, border-right 1s ease-out 0s;	
	background: rgba(255, 255, 255, 0.14);
	transition: background 1s ease-out;
}


#module_62 .menuLevel0.selectedAscendant a,
#module_62 .menuLevel0.selected a {
    background: none repeat scroll 0% 0% #FFF;
    color: rgb(81, 52, 137);
    border-top-right-radius: 1em;
    border-top-left-radius: 1em;
		font-style: normal;
}

#module_62 .option_835.selectedAscendant a,
#module_62 .option835.selected a {
  background: url("spiral/home_icon_blue.png") no-repeat center center white;
}

/******** New sub-menus ********/

#page-data #module_61 {
	max-width: 100%;
	padding: 1em;
	margin-top: 0.4em;
}

#module_61 .menuLevel0 a {
    display: block;
    font-family: source,sans-serif;
    font-weight: normal;
		font-size: 1.3em;
    color: #89346A;
   padding: 0.8em 1.2em 0.8em 1.2em;
    transition-duration: 0.3s;
    transition-property: box-shadow, transform, color, background;
    border-radius: 0.6em;
}

#module_61 .menuLevel0.selectedAscendant > a,
#module_61 .menuLevel0.selected > a {
    color: white;
    box-shadow: 0px 10px 10px -10px rgba(0, 0, 0, 0.5);
    background: none repeat scroll 0% 0% rgb(135, 123, 214);
    border-radius: 0.6em;
}

#module_61 .menuLevel0 > a:hover, #module_61 .menuLevel0 > a:active {
    box-shadow: 0px 10px 10px -10px rgba(0, 0, 0, 0.5);
    transform: scale(1.1);
    background: none repeat scroll 0% 0% #C5BCFF;
    color: #89346A;
    border-radius: 0.6em;
		z-index: 100;
}

#module_61 .structuremenu:after,
#module_61 .structuremenu:after {
	content: " ";
	clear: both;
}

#module_61 .cssmenu_horiz ul, .cssmenu_vert ul {
    background: none repeat scroll 0% 0% #FFF;
    border: 1px solid #877BD6;
    border-radius: 1em;
}

#module_61 .cssmenu_horiz li:hover ul, #module_61 .cssmenu_horiz li.sfHover ul, #module_61 .cssmenu_vert li:hover ul, #module_61 .cssmenu_vert li.sfHover ul {
    left: 0px;
    top: 4em;
    z-index: 1752;
}

#module_61 .menuLevel1 a:hover {
    color: blue;
}

/***** spyears radio buttons *****/

.spiralyearsForm input {
  width: 0; height: 0; position: absolute; left: -9999px;
}


.spiralyearsForm input + label{
    display: inline-block;                                               
    font-family: source,sans-serif;                               
    font-weight: normal;                                          
    font-size: 1.3em;                                             
    color: #89346A;                                               
    padding: 4px 8px;                              
    transition-duration: 0.3s;                                    
    transition-property: transform, color, background;
    border-radius: 0.2em;                                         
		margin: 0;
		height: auto; 
}                                                                 


.spiralyearsForm input + label:hover, .spiralyearsForm input:checked + label {
  transform: scale(1.1);                              
  background: none repeat scroll 0% 0% #C5BCFF;       
  color: #89346A;                                     
  border-radius: 0.2em;                               
  z-index: 100;                                       
}

.spiralyears p, .spiralyears form .spiralyears .spyearstitle {
  display: inline-block;
  float: left;
  width: auto;
		margin: 0;
}

.spiralyears .spyearstitle {
    clear: both;
    font-family: alegreya, sans-serif;
    font-size: 1.3em;
		font-weight: bold; 
    line-height: 1em;
    color: #30247A;
   	padding: 4px 8px;                              
		margin: 0;
		height: auto; 
}


/***** HG selector radio buttons *****/

.sel_HG_colorsyn input {
  width: 0; height: 0; position: absolute; left: -9999px;
}


.sel_HG_colorsyn input + label{
    display: inline-block;                                               
    font-family: source,sans-serif;                               
    font-weight: normal;                                          
    font-size: 1.3em;                                             
    color: #89346A;                                               
    padding: 4px 8px;                              
    transition-duration: 0.3s;                                    
    transition-property: transform, color, background;
    border-radius: 0.2em;                                         
		margin: 0;
		height: auto; 
}                                                                 


.sel_HG_colorsyn input + label:hover, .sel_HG_colorsyn input:checked + label {
  transform: scale(1.1);                              
  background: none repeat scroll 0% 0% #C5BCFF;       
  color: #89346A;                                     
  border-radius: 0.2em;                               
  z-index: 100;                                       
}


/******** Infopages sub-menus ********/

.clearfloats, .divider {
	clear: both;
}

#page-data .terr_nav {
	display: block;
	max-width: 100%;
	padding: 1em;
	margin-top: 0.4em;
}

.terr_nav a {
		display: block;
		float: left;
    font-family: source,sans-serif;
    font-weight: normal;
		font-size: 1.2em;
    color: #89346A;
   padding: 0.8em 1.2em 0.8em 1.2em;
    transition-duration: 0.3s;
    transition-property: box-shadow, transform, color, background;
    border-radius: 0.6em;
}

.terr_nav a:hover {
    box-shadow: 0px 10px 10px -10px rgba(0, 0, 0, 0.5);
    transform: scale(1.1);
    background: none repeat scroll 0% 0% #C5BCFF;
    color: #89346A!important;
    border-radius: 0.6em;
		z-index: 100;
}


.tracker1output .titlebar {
	clear: both;
}

/******* Old menus *******/

#topbar_modules {
	background: url(spiral/menu_transpa.png);
	clear: both;
}


#topbar_modules .cssmenu_vert, #topbar_modules .cssmenu_vert li {
	width: auto;
}

.cssmenu_horiz a,
.cssmenu_vert a {
	font-family: source, sans-serif;
	font-size: 1.4em;
/*	font-size: 1.4vw;*/
	font-weight: bold;
	padding: 4px 9px;
	text-decoration: none;
}

/* left column width */
#col2 ul.cssmenu_vert {
	padding-left: 0;
}

#col2 .cssmenu_vert,
#col2 .cssmenu_vert li {
	width: 160px;
}

/* offset from left column (matches above) */
#col2 .cssmenu_vert li:hover ul,
#col2 .cssmenu_vert li.sfHover ul {
	left: 160px;
}

/* return ul ul ... to default */
#col2 .cssmenu_vert li:hover ul,
#col2 .cssmenu_vert li.sfHover ul,
#col2 .cssmenu_vert li:hover ul li,
#col2 .cssmenu_vert li.sfHover ul li {
	width: 10em;
}

/* return ul ul ... to default */
#col2 .cssmenu_vert li li:hover ul,
#col2 .cssmenu_vert li li.sfHover ul {
	left: 10em;
}

#topbar_modules .cssmenu_vert a,
#topbar_modules .cssmenu_horiz a {
	padding: 12px 2vw;
	font-weight: bold;
	color: white;
	font-family: source, sans-serif;
}


.cssmenu_horiz ul, .cssmenu_vert ul {
	background: white;
	border: solid 1px black ;
}

#topbar_modules .cssmenu_horiz ul li a:hover,
#topbar_modules .cssmenu_vert ul li a:hover {
	color: white;
}
#topbar_modules .cssmenu_horiz li.menuLevel1 a,
#topbar_modules .cssmenu_vert li.menuLevel1 a {
	color: black;
}

#topbar_modules .cssmenu_horiz li.menuLevel1 li.menuLevel2 a,
#topbar_modules .cssmenu_vert li.menuLevel1 li.menuLevel2 a {
	color: black;
}

#topbar_modules .cssmenu_horiz li.menuLevel1:hover a,
#topbar_modules .cssmenu_vert li.menuLevel1:hover a {
	border-bottom: none;
	color: white;
}

#topbar_modules .cssmenu_horiz li.menuLevel1 li.menuLevel2:hover a,
#topbar_modules .cssmenu_vert li.menuLevel1 li.menuLevel2:hover a {
	color: white;
}
/*
#topbar_modules .cssmenu_horiz li.menuLevel0 a, 
#topbar_modules .cssmenu_vert li.menuLevel0 a {
	padding-right: 1.0em;
}
	*/
.cssmenu_horiz li.selected > a, 
.cssmenu_vert li.selected > a {
	font-style: normal
}

#topbar_modules .cssmenu_horiz li.menuLevel1 a,
#topbar_modules .cssmenu_vert li.menuLevel1 a {
	font-weight: normal;
	padding-top: 3px;
	padding-bottom: 3px}
	
.secondary_site_menu li.menuLevel0 a:hover {
	color: #506887;
}

.secondary_site_menu li.menuLevel0 ul li a {
	color: #fff;
}

.cssmenu_vert .sf-sub-indicator {
	background: url(spiral/arrows-6d819d.png) no-repeat 10px 0;
}

.cssmenu_vert .sf-sub-indicator,
.secondary_site_menu .cssmenu_horiz .sf-sub-indicator {
	background: url(spiral/arrows-6d819d.png) no-repeat 10px 0;
	display: inline;
}

.cssmenu_vert li ul li a .sf-sub-indicator {
	background: url(../lib/jquery/superfish/images/arrows-ffffff.png);
	display: inline;
}

/* Tiki 9 */
#topbar_modules .sf-sub-indicator {
	display: none; /* To hide arrows in top menus links */
}

.sf-arrows .sf-with-ul:after {
	display: none;
}

/* less padding so move ul ul up */
#topbar_modules ul.cssmenu_horiz li:hover ul, 
#topbar_modules ul.cssmenu_vert li:hover ul,
#topbar_modules ul.cssmenu_horiz li.sfHover ul, 
#topbar_modules ul.cssmenu_vert li.sfHover ul {
	top: 3.2em;
}

/* but not ul ul ul */
#topbar_modules ul.cssmenu_horiz li li:hover ul,
#topbar_modules ul.cssmenu_vert li li.sfHover ul,
#topbar_modules ul.cssmenu_horiz li li:hover ul,
#topbar_modules ul.cssmenu_vert li li.sfHover ul {
top: 0;
}


/****** Special tools menu ******/
#topbar_modules .role_navigation li.option834,
#topbar_modules .role_navigation li.option592 {
  background: url("spiral/cogwheel.png") no-repeat center center;
  float: right;
  overflow:hidden;
}

#topbar_modules .role_navigation li.option592:hover, li.option834 ul li:hover,
#topbar_modules .role_navigation li.option592:hover, li.option592 ul li:hover {
  background: url("spiral/cogwheel_select.png") no-repeat center center;
}

/****** Special home menu link ******/
#topbar_modules .role_navigation li.option835 {
  background: url("spiral/home_icon.png") no-repeat center center;
  overflow:hidden;
  white-space:nowrap;
	color: rgba(255, 255, 255, 0);
}

.option592 span,
.option835 span,
.option834 span {
	color: rgba(255, 255, 255, 0);
}

#topbar_modules .role_navigation li.option835:hover, li.option592 ul li:hover {
 background: url("spiral/home_icon.png") no-repeat center center;
}



/*********** Including the new structure menu *************/
/*** Structure menu specific + hack vertical menu ***/


#topbar_modules ul li {
	display: block;
	float: left;
}

/* Hack offset from left column for vert menu horiz used */
#topbar_modules .cssmenu_vert li:hover ul,
#topbar_modules .cssmenu_vert li.sfHover ul {
	position: absolute;
	left: 0px;
}

/*** Old SPIRAL menu = first line, new structures menu = second line ***/

#left_modules a, #topbar_modules a {
	color: black;
}

#topbar_modules .role_navigation a:hover {
	border-bottom: none;
}
/* Contact Us in Red*/
#topbar_modules .role_navigation li.option573 a {
	color: #782121;
}

#topbar_modules .role_navigation li.option592 ul li a {
	color: black;
}



/* Menu Dashboard in light purple */
#topbar_modules .role_navigation li.option592 a {
	color: #f7d8ff;
}

#left_modules .role_navigation ul li:hover {
	border-bottom: none;
	background: #002d97;
	font: bold;	
}


#left_modules .role_navigation ul li:hover a {
	border-bottom: none;
	color: white;
}

#left_modules .role_navigation ul li:hover ul li a {
	border-bottom: none;
	color: black;
}

#left_modules .role_navigation ul li ul li:hover a {
	border-bottom: none;
	color: white;
}


ul.sf-shadow ul {
	border: 1px solid black;
	padding: 0;
	background: white;
}

/*.box-search {
	position: absolute;
	right: 40px;
	top: 0;
	color: #fff;
	margin-top: 8px;
}*/

#topbar_modules input#fuser,
#topbar_modules #search_mod_input_1 {
	border: 1px solid;
	border-color: #878689 #f3f3f4 #f3f3f4 #878689;
	background: #afafaf;
	color: #fff}


/******* SPIRAL PageTop Area *******/


#pagetop_modules {
  display: none;
	margin-top: 6px;
}

#pagetop_modules .module {
	margin-bottom: 0px;
}

#pagetop_modules .module a:hover, #pagetop_modules .module a:focus, #pagetop_modules .module a:active {
	text-decoration: underline;
}

#pagetop_modules h3 {
	display: none;
}

/******  SPIRAL Admin menu *****/

#c1c2 #wrapper .marginright {
  margin-right: auto;
}

#col3 {
  position: fixed;
  z-index: 1005;
  top: 0;
  left: -100%;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 0 3em 0 0;
  background: #2c2c2c url("../img/icons/wrench.png") no-repeat;
  background-position: 99.5% center;
  background-origin: padding-box;
  transition: 500ms;
  transition-delay: 5s;
  -moz-box-shadow: inset 0 0 0.2em #000000;
  -webkit-box-shadow: inset 0 0 0.2em #000000;
  box-shadow: inset 0 0 0.2em #000000;
  border-radius: 0 0 1.8em 0;
}

#col3:hover {
  left: 0;
  transition: 500ms;
}

#col3 span, #col3 a {
  color: white;
}

#col3 #module_18, #col3 #module_59, #col3 #module_29, #col3 #module_51, #col3 #module_20 {
  float:left;
}

#col3 #module_18 {
  width: auto;
}

#col3 #module_20 {
  clear:both;
}

#col3 #module_18 .sf-arrows {
  display: none! important;
}

#col3 .cssmenu_horiz ul, #col3 .cssmenu_vert ul {
  background: #2c2c2c;
}

#col3 #module_59 {
  padding-left: 2em;
}

#col3 #quickadmin {
  padding: 0.3em;
}

#col3 .sf-arrows .sf-with-ul {
  padding: 0.2em 1em 0.2em 0;
}

#col3 span {
  font-size: 14px;
  font-family: alegreya;
  font-style: normal;
  color: rgb(234, 230, 230);
  text-shadow: 1px 1px 2px rgb(0, 0, 0);
}


/*************** Maps and their config ***************/

.olMap svg {
    max-width: inherit;
    display: block;
    margin: auto;
}


/*********  Community page   **********/

.listgroups {
	display: none;
}



/***** Misc. Center Col. *****/
a.flip,
a.flip:visited,
.tellafriend a,
.share a,
.tellafriend a:visited,
.share a:visited {color: #ADBAC3}

a.flip:hover,
.tellafriend a:hover,
.share a:hover {color: #505050}

#tiki-center {font-size: 1.1em}


/*********** SPIRAL colorsyn plugin ***********/

/******* Styles for spiralcolorsyn plugin *******/

/**** Mobile and NoScript first ****/

#page-data .wikiplugin_r img {
  max-width: 96%;
  padding-right: auto;
  padding-left: auto;
}

.dimSlider .family {
  border: 1px solid white;
  box-shadow: 4px 4px 3px gray;
  margin-bottom: 40px;
  background-color: #e7e7e7;
}

.dimSlider .family .multicol {
  padding: 0 2% 2% 2%;
}

.dimSlider .family .nocol {
  padding: 0 2% 2% 2%;
}

.dimSlider .family .hgName {
  padding: 0 0 0.4em 0;
}

#role_main .dimSlider .family h1,
#role_main .dimSlider .family h2 {
  padding: 1.3%;
	margin: 0;
  border-top: 1px solid white;
  border-bottom: 1px solid white;
  margin-bottom: 10px;
}

#role_main .dimSlider .family h1, 
#role_main .dimSlider .family h2 {
  color: black;
	font-size: 1.4em;
	font-weight: bold; 
}

.dimSlider .family h1 span,
.dimSlider .family h2 span {
}
  
.dimSlider .family h1 span:first-child::after,
.dimSlider .family h2 span:first-child::after {
  content: " : ";
}

.dimSlider .ind>p {
  padding: 1em 2%;
  color: #454545;
  font-style: italic;
  font-size: 1em;
}

.dimSlider h3 {
  font-size: 1em;
  text-decoration: underline;
  margin: 0;
  padding: 0;
}

#role_main .dimSlider .hgName {
  font-size: 0.95em;
  color: #424242;
}

#role_main .dimSlider .crit {
  font-size: 0.95em;
  color: black;
  font-style: italic;
  margin: 0;
  padding: 0;
}

/**** Desktop version with jquery ****/

/**** CSS-only ****/

.dimSlider .multicol {
  -moz-columns: unset;
  -webkit-columns: unset;
  columns: unset;
}


@media (min-width: 800px) and (max-width: 1200px) {
.dimSlider .multicol {
  -moz-columns: 2;
  -moz-column-gap: 1vw;
  -webkit-columns: 2;
  -webkit-column-gap: 1vw;
  columns: 2;
  column-gap: 1vw;
}
} 

@media (min-width: 1200px) {
.dimSlider .multicol {
  -moz-columns: 4;
  -moz-column-gap: 1vw;
  -webkit-columns: 4;
  -webkit-column-gap: 1vw;
  columns: 4;
  column-gap: 1vw;
}
}                                       

/**** Jquery ****/

.dimSlider .hgView {
  background: linear-gradient(90deg, #adadad, #d2d2d2);
}

.dimSlider .hgName {
  cursor: zoom-in;
}

.dimSlider .hgView {
  cursor: zoom-out;
}


/***** SPIRAL dimensions print with colorsyn plugin *****/

@media print {

.dimSlider, .dimPrint, #page-data, #top, #role_main, #tiki-center, #col1, #wrapper, #c1c2, #middle, .middle_outer, #main, #fixedwidth, body {
	float: none;
}

	.dimPrint h1,
	.dimPrint .dimSlider .A,
	.dimPrint .dimSlider .B,
	.dimPrint .dimSlider .C,
	.dimPrint .dimSlider .D,
	.dimPrint .dimSlider .E,
	.dimPrint .dimSlider .F,
	.dimPrint .dimSlider .G,
	.dimPrint .dimSlider .H,
	.dimPrint .dimSlider .I {
  	page-break-inside: avoid;
	}

.dimSlider .ind>p {
  font-size: 0.8em;
}

.dimSlider h3 {
  font-size: 0.8em;
}

.dimSlider .hgName {
  font-size: 0.6em;
}

.dimSlider .crit {
  font-size: 0.6em;
}

	.header_outer,
	#footer,
	#topbar_modules,
	#col3 {
	display: none;
	}
}

.dimPrint .dimSlider .family {
  border: 1px solid black;
  box-shadow: 4px 4px 3px gray;
  margin-bottom: 40px;
  background-color: white;
	width: 46%;
	display: block;
	float: left;
	margin-right: 2%;
}

@media (max-width: 768px) {
	.dimPrint .dimSlider .family {
		width: 96%;
	}
}

.dimPrint .dimSlider .C,
.dimPrint .dimSlider .E,
.dimPrint .dimSlider .G,
.dimPrint .dimSlider .I {
	clear: both;
}

.dimPrint .dimSlider .family h1, .dimPrint .dimSlider .family h2 {
	background-color: white;
	color: black;
  border: none;
}

.dimPrint .dimSlider .family h1, .dimPrint .dimSlider .family h2 {
	padding: 2%;
	width: 96%;
	border-top: 1px solid black;
	border-bottom: none;
	text-shadow: none;
	color: black;
	box-shadow: none;
	text-shadow: none;
}

.dimPrint .dimSlider .family h1 {
	border-top: none;
	background-color: #d5d5d5;
}

.dimPrint .dimSlider .ind > p {
	padding: 0 2%;
	color: black;
	font-style: italic;
	font-size: 1em;
  margin: 0 0 0 0;
}

.dimPrint .dimSlider .dimstat {
	display: none;
}

/************* Spiral platform listings **************/

.platformMap #openlayers1 {
	width: auto!important;
}

.tracker1output {
	clear: both;
	float: none;
}

.mapHeader {
	margin-bottom: 2em;
	float: left;
	clear: both;
	width: 100%;
}

.platformMap {
  float: left;
  width: 28%;
}

#platform1, 
#platform2, 
#platform3, 
#platform4, 
#platform5, 
#platform6 {
	height: 41px;
}


#role_main .platformTopic {
    clear: both;
		font-family: alegreya, sans-serif;
    font-size: 2.3em;
    line-height: 1em;
    color: #08003C;
		text-align: center;
		padding: 1em 2em 1em 2em;
		background-color: #D8D3FE;
		margin: 1em 0 1em 0;
}

.platformMenu {
  float: left;
  width: 20%;
	padding: 0 2% 0 2%;
}

.platformPicture {            
  float: left;                
  width: 48%;                 
  height: 400px;             
  overflow: hidden;           
  position: relative;         
}                             
                              
.platformPicture img {        
    max-height: 100%;         
    max-width: 100%;          
    width: auto;              
    height: auto;             
    position: absolute;       
    top: 0;                   
    bottom: 0;                
    left: 0;                  
    right: 0;                 
    margin: auto;             
}  

/***** Options for small screens *****/

@media (max-width: 980px) {
	.platformMap,
	.platformMenu,
	.platformPicture {
		float: none;
		clear: both;
		width: 100%;
		margin: 1em 0;
		}

.mapHeader {
	float: none;
}

}



/****** View actions ******/

.trackeractionsoutput {
  padding: 2em;
  background-color: white;
  border: none;
}

.trackeractionsoutput p {
  font-size: 1.2em;
  color: black;
}


/************* Spiral achievements **************/


.sp-realisations {
  max-width: 800px;
}

.sp-realisations table {
  width: 100%;
  border: 1px solid white;
  border-collapse: collapse;
  background-color: #e4e4e4;
}

.sp-realisations th {
  background-color: #686868;
  color: White;
  font-size: 1em;
  border: 1px solid white;
}

.sp-realisations th.phase {
  font-size: 0.6em;
}

.sp-realisations td {
  border: 1px solid white;
	vertical-align: top;
}

.sp-realisations .phase {
  width: 8%; 
  padding: 5px 2%;
	vertical-align: middle;
}

.sp-realisations .achievement {
  width: 52%;
  padding: 4px 2%;
}

.sp-realisations .achieved {
  width: 32%;
  padding: 4px 2%;
}

.sp-realisations .phase1 {
  background-color: #ececec;
}

.sp-realisations .phase2 {
  background-color: #d4d4d4;
  
}

.sp-realisations .phase3 {
  background-color: #ececec;
  
}

.sp-realisations .phase4 {
  background-color: #d4d4d4;
  
}

.sp-realisations .phase5 {
  background-color: #ececec;
  
}

.sp-realisations .phase6 {
  background-color: #d4d4d4;
  
}

.sp-realisations .phase7 {
  background-color: #ececec;
  
}

.sp-realisations .phase8 {
  background-color: #d4d4d4;
  
}

/************* SPIRAL slideshow ********************/

.s5-slide .s5-header {
	display: block;
	width: 100%;
	height: 20%;
	background-image: url(spiral/blacktranspa.png) !important;
	background-repeat: repeat-x !important;
	color: white;
	font-size: 3em;
	font-weight: bold;
	padding: 20px 50px 20px 50px;
}

.s5-slide ul li {
	display: block;
	font-size: 2em;
	color: #101157;
}

.s5-slide ul li ul li {
	font-size: 1.5em;
	color: black;
}

.s5-slide {
	font-size: 2em;
}
/****** Misc. Global ****/

/***** Boxes *****/
/** Modules **/

.box {
	margin-bottom: 16px;
	display: block}
	
#leftcolumn .box,
#rightcolumn .box {width: 160px}
	
.wikitext .box {width: 96%}

.module14{
	float: left;
}

h3.box-title {
	color: #782121;
	font-family: source,sans-serif;
	font-size: 1.5em;
	font-weight: 100;
	border-top: 1px solid #782121;
	border-bottom: none;
	padding-top: 15px;
}

.flipmodimage:hover {border: 1px solid #58A7D2 !important}

/** Other boxes **/
.cbox {
	border: 1px solid #e0e0e0;
	background: inherit;
	color: inherit;
	background: #fff}

.cbox-title {
	border-bottom: 1px solid #e0e0e0;
	text-align: center;
	font-weight: bold;
	padding: 3px 3px 1px 3px}

.cbox-data {padding: 3px}

.rbox {margin: 5px 10px 5px}

.rbox-title,
.rbox-data {
	border-color: #506887;
	background: #cecece;
	color: #000}

.simplebox {
	border: 1px solid #e0e0e0;
	padding: 4px;
	background: white;
	color: inherit}

/***** Tables, Tabs *****/
/** Tables **/

.wikitable td {
	margin: 0;
	padding: 0.6em;
	vertical-align: top}

td.odd:hover,
td.even:hover {border-right: 1px solid #e0e0e0}

.normal td.heading {font-size: 1em}

.normal td.odd:hover,
.normal td.even:hover,
.normal tr:hover {background: #f3f3f4}

/*
.normal td,
.wikitable td,
td.odd,
td.even,
.form,
.formcolor td,
.editblogform td {
	border: 1px solid #8cacbb;
	background: #DEE7EC}
*/ 


* body th {font-size: 12px}

/** Tabs **/
/* reset what's in layout.css */

.tabactive,
.tabinactive,
[class].tabactive,
[class].tabinactive {top: 0 !important}

.tabs {
	padding: .2em .2em 0;
	margin: 0 0.2em 0 0;
}
	
.tabs br {
	display: none;
}

.tabs span {
	display: block;
	float: left;
}

.tabmark {
	float: left;
	color: #000;
	border-bottom-width: 0 !important;
  display: inline-block;                      
  padding: 0.1em 0.6em 0.1em 0.6em;
  background: none repeat scroll 0 0 #f0e5f3;
  border: none;
  border-radius: 5px 5px 0px 0px;
}

.tabmark a {
	font-size: 1.2em;
  font-family: open, sans-serif;
  color: #5b008a;
}

.tabmark:hover, .tabmark:active, .tabmark:focus {
  background: #f0e5f3;
  border: none;
}

.tabmark.tabactive {
  border-radius: 5px 5px 0px 0px;
  background: none repeat scroll 0 0 #af76bf;
  border: none;
	box-shadow: inset 0px 0px 3px #7e718c;
}

.tabactive a {
  color: white;
}

.statuson {
	border: 1px solid #8cacbb;
}

.tabcontent {
	border: 1px solid #a9a9a9;
	background: white;
	color: #2b085f;
	padding: 2px;
}

form fieldset.tabcontent {
	border: 1px solid #af76bf;
	background: #f0e5f3;
	border-radius: initial;
}

.multiselect {
	background: white;
}

.admin .tabcontent .cbox {background: transparent}

/** Wiki plugins **/

/** Plugin Spiral Tree **/

.spiralTree .CGcontinent {
	display: block;
	float: left;
	width: 100%
}

.spiralTree .CGcountry {
	display: block;
	float: left;
	width: 100%
}

.spiralTree .CGregion {
	display: block;
	float: left;
	width: 100%
}

.spiralTree .CGname {
	display: block;
	float: left;
	clear: both;
	min-height:1.6em;
}

.spiralTree .CGachievements {
	display: block;
	float: left;
	min-height:1.6em;
	padding-left: 2%;
}

.spiralTree .CGlevel1 {
	padding-left: 0%;
}

.spiralTree .CGlevel2 {
	padding-left: 2%;
}

.spiralTree .CGlevel3 {
	padding-left: 4%;
}

.spiralTree .CGstat {
	position: relative;
	top: 6px;
	left: -14px;
	color: black;
	background-color: #fbfbfb80;
	border-radius: 5px;
	padding: 0 2px;
}

.spiralTree .CGachievement a {
	color: black;
}

.spiralTree .level1box {
	float: left;
	position: relative;
	width: 96%;
	background: #efefef;
	margin: 0.4em 1% 0.4em 1%;
	padding: 0.4em 1% 0.4em 1%;
	border-radius: 10px;
}

.spiralTree .CGname .CGTreetools {
	display: inline-block;
	position: absolute;
	left: -38px;
	border-radius: 5px;
	padding: 0 2px 0 2px;
	opacity: 0.6;
	transition: opacity 2s;
}

.spiralTree .CGname:hover .CGTreetools {
	opacity: 1;
	transition: opacity 0.2s;
}


.spiralTree .CGlevel1 a {
  color: #000ad7;
}

.spiralTree .CGlevel2 a {
  color: #01720e;
}

.spiralTree .CGlevel3 a {
  color: #7200a4;
}

#role_main .spiralTree h1, #role_main .spiralTree h2, #role_main .spiralTree h3 {
  margin-top: -50px;
}

#role_main .spiralTree h1, #role_main .spiralTree h2 {
  margin-bottom: -45px;
}

/**** SpiralTree Summary ****/

#role_main .spiraltreeMenu .spiraltreeMenu {     
  float: left;
  width: 100%;
  margin-bottom: 2em;
}                                 

#role_main .spiraltreeMenu h1 {     
  margin-bottom: 0px;
  margin-top: -80px;
}                                 

.spiraltreeMenu .TreemenuContinentLevel {
  background: #f0f0f0f0;
  border-radius: 1em;
  float: left;
  padding: 1em 1% 1em 1%;
  margin: 1em 2% 1em 0;
  width: 29.33%;
  list-style-type: none;
}

.spiraltreeMenu .TreemenuCountry {
  list-style-type: none;
}

.spiraltreeMenu .TreemenuRegion {
  list-style-type: none;
  }

.spiraltreeMenu .TreemenuRegion a {
  color: #333;
  }

.spiraltreeMenu .TreemenuRegionLevel {
  width: 30%;
  border-radius: 1em;
  padding: 0.5em;
  visibility: hidden;
  position: absolute;
  background-color: #bbb;
  transition-delay: 100ms;
  transition-property: visibility;
}

.spiraltreeMenu .show_regions {
  visibility: visible;
  transition-property: visibility;
  transition-delay: 0s;
}

.spiraltreeMenu .TreemenuRegion {
  display: inline-block;
  float: left;
  margin-left: 1em;
}

.TreemenuContinent>a {
  color: #6b38b6;
  font-size : 1.4em;
}

.TreemenuCountry>a {
  color: #562be2;
  font-size : 1em;
  font-style: italic;
}

.spiraltreeMenu {
  color: #777;
}

.spiraltreeMenu .TreeDevelop {
  cursor: zoom-in;
}




/* Plugin spiralcountries */

.spiralcountries .nbitems {
  clear: both;
	text-align: right;
	padding-right: 10em;
}

.spiralcountries #toc>ul>li>ul {
	display: block;
	width: 20em;
	float: left;
}

.spiralcountries .cycle1, .spiralcountries .cycle2, .spiralcountries .cycle3 {
	display: inline-block;
	height: 100%;
	padding-top: 0.12em;
}

.spiralcountries .achievedspan {
    display: inline-block;
    padding: 0 1px 0 1px;
    border: 1px white;
}

.spiralcountries .cycle1 {
	background-color: #A70000;
	color: white;
}

.spiralcountries .cycle2 {
	background-color: #F68B00;
	color: white;
}

.spiralcountries .cycle3 {
	background-color: #008C5A;
	color: white;
}

/* Plugin trackerfilteredit in editplatform mode */
.editplatform .btn-default {
	display: none;
}

.editplatform .field484 input {
    width: 100%;
}

.editplatform td {
	text-align: center;
}

/* Code plugin  */
.code {
	font-size: 90%;
	padding: 3px;
	border: 1px dashed #ccc;
	background: #F5F5F5;
	font-family: "Courier New", Courier, monospace}

.codelisting {
	font-family: "Courier New", Courier, monospace;
	padding: 10px;
	background: #F5F5F5;
	border: 1px dashed #ADACAF;
	overflow: auto;
	width: 500px}
	
.codecaption {
	font-size: 90%;
	padding: 0 10px;
	position: relative;
	bottom: -5px;
	display: inline;
	border: 1px solid #ADACAF;
	border-bottom: 0;
	margin: 0;
	color: #666;
	background: #F5F5F5;
	font-weight: bold}

/* Quote plugin */
.quoteheader {margin-left: 20px}
.quotebody {font-style: italic}

/** Wiki tocs **/
.tocnav {
	background: #FFF;
	padding: 3px}

/* TOC */
.toc {
	border: none;}

#toc>ul>li>ul>a {
	font-size: 1.2em;
	color: #8B376E;
}

.diff td {border: 1px solid #A9B8C2}
.diff div {border-top: 1px solid #A9B8C2}
.diffheader {background: #A9B8C2}

/******** Plugin tracker ********/

#role_main .wikiplugin_tracker .trackerplugindesc {
    color: #F60;
}

/******** Tables in R plugin ********/
pre table, pre caption, pre tbody, pre tfoot, pre thead, pre tr, pre th, pre td {
	border: 0 none;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0 none;
	padding: 0;
	vertical-align: baseline;
}

pre table {
	border-collapse: separate;
	border-spacing: 0;
	border: 1px solid #AFA7DD;
}

pre caption, th, td {
	font-weight: normal;
	text-align: left;
}

pre th {
	border-left: 1px solid white;
	background: #AFA7DD;
	font: 1.4em bold;
	font-family: arial, sans-serif;
	color: white;
}

pre table tr:hover {
	background: #f0f3fe;
}


pre table tr th:first-child {
	background: white;
	border-left: none;
}

pre table tr td:first-child {
	border-top: 1px solid white;
	background: #AFA7DD;
	font: 1.4em bold;
	color: white;
	font-family: arial, sans-serif;
}




/***** Articles ****/
.wikitext .article {font-size: 1em}

.articletopline {
	font-size: 90%;
	font-style: italic}

.articletitle {
	margin-top: 6px;
	margin-bottom: 15px;
	text-align: left}

.articletitle h2 {
	font-size: 1.5em;
	font-weight: normal}

.titleb {font-size: 1.0em}
.articlesubtitle {font-size: 0.9em}
.articleheading {margin: 6px 0}
.articlebody {margin-top: 1em}

/***** Blogs *****/
.blogtitle {
	font-size: 1.3em;
	font-weight: bold;
	padding: 3px;
	margin-top: 10px;
	font-weight: bold;
	line-height: 80%}

.bloginfo {
	text-align: center;
	padding: 3px;
	line-height: 150%;
	text-transform: none;
}

.postinfo a {
	color: #9CF;
	text-decoration: none;
	border-bottom: 1px dotted #9CF}

a.blogt:hover {
	color: #FFF;
	border-bottom: 1px dotted #FFF}

.postinfo {font-size: 1.2em}

.posthead {
	font-weight: bold;
	letter-spacing: .4pt}

.posthead h3 {font-size:1.2em}



/********** Spiral wiki snippets *************/

/* Jquery to adapt the html for custom boxes
// Remove <br>
$(".SPBox br").remove();

// Remove TikiWiki image attributes
$(".SPBox img").removeAttr('height width');*/

.SPBox {
	width: 25%;
}

.SPBox img.regImage {
	width: 100%;
	height: auto;
	vertical-align: middle;
}

.SPBox {
	display: block;
	position: relative;
	margin: 0 1em 1em 0;
}

.SPBox .SPBox-Caption {
	background: none repeat scroll 0 0 rgba(255, 255, 255, 0.8);
	bottom: 0;
	display: block;
	max-height: 100%;
	overflow: auto;
	padding: 0.3em 0.2em 0.2em;
	position: absolute;
	max-width: 100%;
	min-width: 100%;
}

.SPBox-Title {
    font-family: source,arial,sans-serif;
    font-size: 1.6em;
    padding: 0 0 0.3em 0;
}

.SPBox-Summary {
	font-size: 0.8em;
}

.SPBox-Extended {
	display: none;
	font-size: 0.8em;
}



/* Pulsing hover */
.Big {
	-webkit-animation: pulse1 1s linear infinite;
	-moz-animation: pulse1 1s linear infinite;
	-ms-animation: pulse1 1s linear infinite;
	animation: pulse1 1s linear infinite;
}

@keyframes "pulse1" {
 0% {
    color: rgba(165, 25, 25, 1);
 }
 90% {
    color: rgba(255,0,0,0.0);
 }
 100% {
    color: rgba(255,0,0,1.0);
 }

}

@-moz-keyframes pulse1 {
 0% {
   color: rgba(165, 25, 25, 1);
 }
 90% {
   color: rgba(255,0,0,0.0);
 }
 100% {
   color: rgba(255,0,0,1.0);
 }

}

@-webkit-keyframes "pulse1" {
 0% {
   color: rgba(165, 25, 25, 1);
 }
 90% {
   color: rgba(255,0,0,0.0);
 }
 100% {
   color: rgba(255,0,0,1.0);
 }

}

@-ms-keyframes "pulse1" {
 0% {
   color: rgba(165, 25, 25, 1);
 }
 90% {
   color: rgba(255,0,0,0.0);
 }
 100% {
   color: rgba(255,0,0,1.0);
 }

}



/* apply a natural box layout model to all elements */
.SPBox *, .SPBox *:before, .SPBox *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }


/********************** Hacks *************************/
/****** Change discuss button to pink - uses jQuery ******/

a.discuss {
	color: #b03291;
	font-weight:900;
}

a.discuss:hover {
	color: #b03291;
	font-weight:900;
}

/***********   SPIRAL hide divs which are only for jQuery reference    ***********/
.hidden {
	visibility: hidden;
	height: 0px;
}

/****** Replace flags in LANG Switch **********/
#mod-switch_langt1 .icon {
/*	visibility: hidden;*/
}


/***********   SPIRAL highlight tracker field comments for HG entry    ***********/

#HGs .trackerplugindesc {
	color: #F60;
}

/**********   Annotation SPIRAL scheme styles   ************/

#container-annotation-1 * {
	color: #ff2d9b;
	font-weight: bold;
}

.annotation-note { /*Hides annotation labels under SPIRAL schema in annotation plugin - comment this to edit annotations*/
/*	display: none;*/
}

/*************** SPIRAL Register new Coordination Group ********************/

.spiralrequested {
	background-color: '';
	border-color: #FE0037;
	border-style: solid;
	border-width: 2px;
}

input.spiralvalid, .spiralvalid {
	border: '';
	background-color: #99FF99;
	color: black;
}



/***********   Synthesis styles   ************/


/************  Set page format  **************/
/** Page format for printing synthesis, only applied if SynSPIRAL div is used in a page */

#synSPIRAL {
	width: 2000px;
	height: 2000px;
}

/*General layout options*/

#Sums {
	clear: both;
	padding-top: 30px;
}


#synSPIRAL table {
	width: 40%;
	border: 1px solid #0B3371;
	padding: 8px;
  background-color: white;
}

#synSPIRAL th {
	background-color: #0B3371;
	color: white;
	padding: 20px 20px 20px 80px;
}

#synSPIRAL .INDtitle {
/*	display: block;*/
	margin-top: 3px;
	border-bottom: 1px solid #0B3371;
	padding: 5px 5px 5px 50px;
}

#synSPIRAL .SynText {
	font-size: 0.7em;
	line-height: 100%;
}

.SynGRP {
	font-weight: bold;
}

/*****  Reduced version of synspiral   *****/


#syngroupsTab #synSPIRAL {
	width: 1200px;
	}

#syngroupsTab table {
	width: 100%;
}

#syngroupsTab .SynText {
	font-size: 1em;
	line-height: 150%;
}

#syngroupsTab th, #syngroupsTab .INDtitle {
	font-size: 1.4em;
} 


#syngroupsTab #ArrowTopLeft, #syngroupsTab #ArrowTopRight, #syngroupsTab #ArrowCenter, #syngroupsTab #ArrowMidLeft, #syngroupsTab #ArrowMidRight, #syngroupsTab #ArrowBottomLeft, #syngroupsTab #ArrowBottomRight {
	display: none;
}

#syngroupsTab #FA, #syngroupsTab #FB, #syngroupsTab #FC, #syngroupsTab #FD, #syngroupsTab #FE, #syngroupsTab #FF, #syngroupsTab #FG, #syngroupsTab #FH, #syngroupsTab #FI, #syngroupsTab #ListGRPSYN {
	margin: 0 0 100px 0;
}

#syngroupsTab table th {
	page-break-after: avoid;
}

#syngroupsTab #FA, #syngroupsTab #FB, #syngroupsTab #FC, #syngroupsTab #FD, #syngroupsTab #FE, #syngroupsTab #FF, #syngroupsTab #FG, #syngroupsTab #FH, #syngroupsTab #FI {
/*	display: block;*/
	page-break-before: always;
}

/****************   Container flow  ****************************/
/*  Synthesis in order of flow of tables and arrow containers  */

#ListGRPSYN {
	display: none;
}

#ListGRPSYN table th {
	background-color= yellow;
}

#syngroupsTab p, #syngroupsTab #selectGHform {
	display: block;
	float: left;
	margin: 10px 0 10px 0;
}

/*#GtabText {
}*/

.SynGH* {
	display: inline-block;
	background-color: blue;
	margin: 10px;
}

#ListGRPSYN {
	float: left;
	clear: both;
	border: 1px solid blue;
	margin: 20px 10px 10px 10px;
}

#ArrowTopLeft {
	clear: both;
	float: left;
	text-indent: -9999px;
	padding: 60px 60px 0 0;
	margin: 92px 0 0 443px;
	background: url(spiral/SPIRALarrowTopLeft.png) no-repeat;
	font-size: 0px;
}

#FG {
	margin: 0 0 0 100px;
	float: left;
}

#ArrowTopRight {
	float: left;
	background: url(spiral/SPIRALarrowTopRight.png) no-repeat;
	text-indent: -9999px;
	padding: 60px 60px 0 0;
	margin: 92px 0 0 106px;
	vertical-align: top;
	font-size: 0px;
}

#FF {
	margin: 10px 0 0 0;
	clear: both;
	float: left;
}

#FH {
	margin: 10px 0 0 0;
	float: right;
}

#FE {
	margin: 10px 0 0 0;
	clear: both;
	float: left;
}

#ArrowCenter {
	float: left;
	background: url(spiral/SPIRALarrowCenter.png) no-repeat;
	text-indent: -9999px;
	padding: 80px;
	margin: 0 0 0 120px;
	position: relative;
	top: -60px;
	font-size: 0px;
}

#FI {
	margin: 10px 0 0 0;
	float: right;
}

#ArrowMidLeft {
	clear: both;
	float: left;
	background: url(spiral/SPIRALarrowMidLeft.png) no-repeat;
	text-indent: -9999px;
	margin: 20px 0 0 443px;
	padding: 60px 60px 0 0;
	font-size: 0px;
}

#FD {
	margin: 10px 0 0 100px;
	float: left;
}

#ArrowMidRight {
	float: left;
	background: url(spiral/SPIRALarrowMidRight.png) no-repeat;
	text-indent: -9999px;
	margin: 20px 0 0 106px;
	padding: 60px 60px 0 0;
	font-size: 0px;
}

#ArrowBottomLeft {
	clear: both;
	float: left;
	background: url(spiral/SPIRALarrowBottomLeft.png) no-repeat;
	text-indent: -9999px;
	margin: 92px 0 0 443px;
	padding: 60px 60px 0 0;
	font-size: 0px;
}

#FC {
	margin: 10px 0 0 100px;
	float: left;
}

#ArrowBottomRight {
	float: left;
	background: url(spiral/SPIRALarrowBottomRight.png) no-repeat;
	text-indent: -9999px;
	margin: 92px 0 0 106px;
	padding: 60px 60px 0 0;
	font-size: 0px;
}

#FA {
	margin: 10px 0 0 0;
	clear: both;
	float: left;
}

#FB {
	margin: 10px 0 0 0;
	float: right;
}

/*****END OF SYNTHESIS STYLES*****/


/************************ Indicators styles *****************************/


.spiralindicators img {
    height: 20px;
    width: 20px;
}

#page-data table {
	border-collapse: collapse;
}

#page-data .tablebordered td {
  border: 1px solid;
}

#page-data table .Answ {
	text-align: right;
}


#page-data .tablebordered .Sit table td {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: -moz-use-text-color -moz-use-text-color #DFCBF2;
    border-image: none;
    border-style: none none solid;
    border-width: medium medium 1px;
}


/***** End ****/

.postbody {
	margin-right: 8px;
	line-height: inherit;
	margin-bottom: 1em}

/***** Forums *****/
.post .postbody {
	background: white;
	font-size: 1em}
	
* html .post .postbody {font-size: 11px}

.post .postbody .content {
	float: none;
	height: 100%;
	padding: 0 3px 3px;
	color: #8f8f8f}

.post .postbody-title {
	display: block;
	margin-top: 0;
	padding: 3px;
	border-bottom: 1px solid #aaa}

.post .postbody-title .title {
	color: #29677B;
	font-weight: bold}

.postbody-title br.clear {display: none}
	
.title a.link {
	color: #29677B;
	text-decoration: none}

.post .author {
	float: left;
	text-align: left;
	width: 33%;
	margin-left: -3px;
	margin-right: 4px;
}

/*	background: url(eatlon/head_bg.gif) repeat-x}*/
	
.post .author_post_info {padding: 2px}
.post .author_post_info:first-letter {text-transform: uppercase}

.post .author_post_info_on {font-style: italic}

.post .author_info {
	padding: 0 2px 2px 2px;
	margin-left: 5px}

.post .postbody-title .actions {font-size: 1em}
.postbody-content {padding: 4px}
.post .postbody .attachments {border-top: 1px dotted #8f8f8f}
.post .postfooter .status {font-size: 1em}

.post .contribution {
	background: #F0F8FF;
	border: 1px solid #D7E5F3;
	padding: 0 2px 0 2px}

.post .avatar {
	float: left;
	width: 33%;
	border: 1px solid #ACCCDD;
	background: inherit}

.forum_actions .actions {
	background: #E1EBF5;
	padding: 3px 3px 3px 3px}

.forum_actions .headers .title {
	background: #e1ebf5;
	padding: 1px;
	font-weight: bold}

.forum_actions .headers .infos {font-size: smaller}

.commentsedithelp {
	background: #ffcfcf;
	color: black;
	border: 1px solid #ff0000;
	text-align: center;
	font-weight: bold}

/**** File Galleries ****/

#fgaltable { 
	width: 1260px;
}

#fgaltable #fgalexplorer {
	width: 30%;
}

#fgaltable .fgallisting {
	width: 70%;
}

.fgallisting {
	clear: both;
}

#fgalexplorer a {
	font-size: 0.6em
}

#fgalexplorer.treenode {
	margin: 0;
	padding: 0;
}

/***** Directory *****/
.dircategs {
	border: 1px solid #8cacbb;
	padding: 5px}

.dirlistsites {
	padding: 5px 0 10px 5px;
	margin-top: 10px}

.dirsite {
	margin: 5px;
	margin-bottom: 10px}

.dirrelated {
	margin-top: 10px;
	padding: 5px}

td.dirfooter {font-size: .95em}
div.dirfooter {margin-top: 10px}

/***** Messages *****/
.prio1,
.prio2,
.prio3,
.prio4,
.prio5 {border: 1px solid #8cacbb}

.messureadflag {background: #ccc}
.messureadhead {background: #DEDEDE}
.messureadbody {background: #DEDEDE}

/***** TikiSheets *****/
.default thead td,
.default tfoot td {
	font-weight: bold;
	text-align: center}

.default td {border: solid 1px #a9a9a9}

/***** Calendar *****/
.Cal0,
.Cal1,
.Cal2 {font-size: 90%}
	
.Calart,
.Calblog,
.Calchart,
.Caldir,
.Caleph,
.Calfaq,
.Calfgal,
.Calforum,
.Calgal,
.Calnl,
.Calquiz,
.Calsurv,
.Caltrack,
.Calwiki {font-size: 1em}

.Calart,
.Calart a,
.Calart a:visited {color: #FA8072}

.Calblog,
.Calblog a,
.Calblog a:visited {color: #DA70D6}

.Calchart,
.Calchart a,
.Calchart a:visited {color: #304F30}

.Caldir,
.Caldir a,
.Caldir a:visited {color: #800080}

.Calfaq,
.Calfaq a,
.Calfaq a:visited {color: #822222}

.Calfgal,
.Calfgal a,
.Calfgal a:visited {color: #8B4513}

.Calforum,
.Calforum a,
.Calforum a:visited {color: #808000}

.Calgal,
.Calgal a,
.Calgal a:visited {color: #8B4513}

.Calnl,
.Calnl a,
.Calnl a:visited {color: #708090}

.Calquiz,
.Calquiz a,
.Calquiz a:visited {color: #5F9EA0}

.Calsurv,
.Calsurv a,
.Calsurv a:visited {color: #DAA520}

Caltrack,
Caltrack a,
Caltrack a:visited {color: #00BD02}

.Calweb {font-size: 1em}
.Calweb:hover {color: #996633}

.Calwiki,
.Calwiki a,
.Calwiki a:visited {color: #2C4B80}

.Calart a:hover,
.Calblog a:hover,
.Calchart a:hover,
.Caldir a:hover,
.Caleph a:hover,
.Calfaq a:hover,
.Calfgal a:hover,
.Calforum a:hover,
.Calgal a:hover,
.Calnl a:hover,
.Calquiz a:hover,
.Calsurv a:hover,
.Caltrack a:hover,
.Calwiki a:hover {color: #9400d3}

.calcontent a.linkmenu,
.calcontent a.linkmenu:hover {
	background: none;
	padding: 0}

.calfocus {
	font-size: 90%;
	background: inherit}

.calprio1 a,
.calprio2 a,
.calprio3 a,
.calprio4 a,
.calprio5 a,
.calprio6 a,
.calprio7 a,
.calprio8 a,
.calprio9 a {color: #393e51}

.caltoggle {font-size: 90%}

.opaque {
	border-left: 1px solid #a9a9a9;
	border-top: 1px solid #a9a9a9;
	border-right: 1px solid #696969;
	border-bottom: 1px solid #696969}

.opaque .box-title {border-bottom: 1px solid black}
.searchresults {display: inline}

#caltable .calfocuson,
.box-data .fc a.today,
.box-data td a.today {
	background: #d2d9e3;
	border: 0}
	
.caltable .calfocuson {
	background: #d2d9e3;
}

#caltable .calfocuson a {color:#000}

#caltable .calfocus a,
#caltable .calfocuson a {text-decoration:none}

.calinput {background: #9faec2}
.calfocuson + .calcontent {background: #F5F5F5}

#caltable td {padding: 0}

#caltable .weeks,
.days {
	background: #9faec2;
	color: white}
	
#caltable .weeks {
	font-weight: bold;
	padding: 2px;
	font-size: 1em}

.event {background: #f5f5f5}

.addevent {
	padding: 0 5px;
	float: right;
}

* html .addevent {
	padding: 0;
}

.calodd, .caleven {
	border: 1px solid #a9a9a9;
}

.calodd {
	background: #ececec;
}

* html .calodd {
	padding: 0;
}

.caleven {
	background: #f5f5f5;
}

* html .caleven {
	padding: 0;
}

.caldark {
	background: #c4cdda;
}

.caldark .calfocus {
	background: #c4cdda;
}

* html .caldark {
	padding: 0;
}

div#calscreen .calfocuson {
	background: #d2d9e3;
}

.calfocuson {
	font-size: 100%;
}

.calfocuson a {
	font-size: 90%;
}

.calHeadingOn, .calHeadingOn a {
	background: #d2d9e3;
}

.daterow {
	display: block;
	border: 1px solid #ccc !important;
	background: #fff;
	font-size: 1.1em;
	font-weight: bold;
	margin-bottom: 3px}

.daterow:hover {
	color: #fff;
	background: #9faec2}

.calnavigation a:hover {
	color: #fff;
	background: #9faec2}

/***** Admin *****/
a.admbox {
	border: 1px solid #aaa;
	background: #506887 center no-repeat}

a.admbox:hover,
a.admbox:focus,
a.admbox:active  {
	background: #B2B2B2 center no-repeat;
	border: 1px solid #9f9f9f}

a.admbox.off {border: 1px solid #9f9f9f}
a.admbox span {color: #fff}

/***** Annotation plugin ****/

.annotationbox {
	border: 2px solid transparent;
	position: absolute;
	line-height: 1em;
	font-size: 0.7em;
	text-align: center;
}

/***** svg *****/
.axisecart text {
	font-family: sans-serif;
	font-size: 11px;
}

.axisecart path, .axisecart line {
	fill: none;
	stroke: black;
	shape-rendering: crispEdges;
}

/* Pour des beaux axes propres et noirs */
.axisdd text {
	font-family: sans-serif;
	font-size: 11px;
}

.axisdd path, .axisdd line, line.axisdd {
	fill: none;
	stroke: black;
	shape-rendering: crispEdges;
}

rect.barres {
	stroke: black;
	shape-rendering: crispEdges;
}

th.alert {
	background: #FF9999;
}

/***** renseignements *****/
.thematique-enjeux-defi > em {
	font-size: 0.8em;
}
.thematique-enjeux-ligne > td {
	border-style: dashed;
	border-width: 1px;
	vertical-align: middle;
}
.thematique-enjeux-nombre {
	text-align: center;
}

.thematique-choix-defis > table {
	border-color: gray;
	border-style: dotted;
	border-width: 1px;
	float: left;
}

.thematique-choix-defis th {
	color: #008000;
	font-weight: bold;
}
.thematique-enjeux th {
	color: blue;
	font-weight: bold;
	text-align: center;
}

table.thematique-enjeux {
	clear: both;
}

.thematique-enjeux-nombre > input {
	color: blue;
	font-weight: bold;
	text-align: center;
}

/***** renseignements *****/
.nombre {
	text-align: center;
}

/* pour plusieurs sur la même ligne */
#graphe02 > svg {
	display: inline;
}

.spiralddresindiv th.gras,
.gras {
	font-weight: bold;
	font-size: large;
}

.resindiv-cellule {
	border-color: gray;
	border-style: dotted;
	border-width: 1px;
}

.echo {
	color: #339966;
}

th.echo {
	background: #339966;
	color: white;
}

.spiralddresindivdetail td,
.spiralddresindiv td.nombre {
    font-size: 12px;
}

.spiralddresindivdetail th,
.spiralddresindiv th {
    font-size: 14px;
}

/***** spiralddforcegraphcoacte *******/
#cartographie {
	clear: both;
}

.forcegraph-cartographie > table {
	border-color: gray;
	border-style: dotted;
	border-width: 1px;
	float: left;
}

.forcegraph-cartographie th {
	color: #008000;
	font-weight: bold;
	font-size: 1.2em;
}

/***** JML tests patates fleuries ******/
/* cf http://bl.ocks.org/mbostock/4062045 */

.node {
  stroke: #fff;
  stroke-width: 1.5px;
}

.link {
  stroke: #999;
  stroke-opacity: .6;
}

.patates_node {
	fill: #ccc;
	stroke: #fff;
	stroke-width: 2px;
}

.patates_link {
	stroke: #777;
	stroke-width: 2px;
}

/* From http://bl.ocks.org/mbostock/1093130 for JML patates 03 */


.patates .node circle {
  cursor: pointer;
  stroke: #3182bd;
  stroke-width: 1.5px;
}


.patates .node text {
    color: black;
    font: 10px sans-serif;
    pointer-events: none;
    stroke: black;
    stroke-width: 0.2px;
    text-anchor: middle;
}

.patates line.link {
  fill: none;
  stroke: #9ecae1;
  stroke-width: 1.5px;
}


/******************** Co-Acte Project *********************/

/********************* Co-Acte ********************/

/* Correct Font sizes */


.CoActeSlider {
    width: 100%;
    height: 600px;
}

.CoActeSlider svg {
    width: 85%;
    max-width: 85%;
}

.CoActe {
    display: none;
}

.CoActeSlider svg,
.CoActeCheck svg {
	height: 600px;
}

.toggle_big {
    display:block;
}

.CoActeSlider .flash, 
.CoActeSlider .highlight {
    cursor: pointer;
}


/**** Animation ****/
/*** bounce ***/

path.flash {
  -webkit-filter: blur(20px);
  -moz-filter: blur(20px);
  -o-filter: blur(20px);
  -ms-filter: blur(20px);
  filter: blur(20px);
}

text.flash {
      text-shadow: 0px 0px 2px #000000;
}


/****** CO-ACTE 3 TCOR meeting program ******/

/******* temp wiki version *******/
#role_main #top .wiki_program {
  width: 70%;
  margin: auto;
  border: 1px solid;
  border-color: #814ECC;
  padding: 40px 15px;
  border-radius: 30px;
  box-shadow: 4px 4px 6px lightgray;
}


#role_main #top .wiki_program li {
  margin-top: 10px;
}

#role_main #top .wiki_program ul>li {
  list-style-image: url("../img/icons/clock.png");
}


#role_main #top .wiki_program li>ul>li {
  list-style-image: url("../img/icons/star.png");
}


/****** Final Version ******/
#c1c2 #page-data .program {
  max-width: 800px;
  padding: 0;
  margin: auto;
  background-color: #9e9e9e;
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.2);
}

#c1c2 #page-data .program p {
  display: block;
  clear: both;
}

#c1c2 #page-data .program .logo {
  float: left;
  width: 15%;
  height: auto;
  margin: 30px 0 0 4%;
  background: none;
}


#c1c2 #page-data .program .mainTitle {
	float: left;
	width: 75%;
  font: 6em "candela", sans-serif;
  color: white;
  text-align: right;
  padding: 17px 5% 0 0;
  text-shadow: -1px -1px 0px rgba(0, 0, 0, 0.41);
}

#c1c2 #page-data .program .subTitle {
  float: right;
  width: 70%;
  font: 2em "candela", sans-serif;
  color: white;
  text-align: right;
  padding: 17px 5% 0 0;
  text-shadow: -1px -1px 0px rgba(0, 0, 0, 0.41);
}

#c1c2 #page-data .program .date {
  display: block;
  float: left;
  clear: both;
  width: 15%;
  margin: 2em 0 0 5%;
  font: 1.4em "source", sans-serif;
  font-variant-caps: all-small-caps;
  color: #2d2d2d;
  text-align: left;
  padding: 0 0 0 0;
  font-weight: bold;
  text-shadow: none;
  text-align: right;
}

#c1c2 #page-data .program .title {
  display: block;
  float: left;
  clear: none;
  width: 70%;
  margin: 2em 5% 0 5%;
  font: 1.4em "source", sans-serif;
  font-variant-caps: all-small-caps;
  color: #2d2d2d;
  text-align: left;
  padding: 0 0 0 0;
  font-weight: bold;
  text-shadow: none;
}

#c1c2 #page-data .program .excerpt {
  display: block;
  float: left;
  clear: none;
  width: 90%;
  margin: 2em 5% 0 5%;
  font: 1.4em "sourceit", sans-serif;
  font-variant-caps: all-small-caps;
  color: #2d2d2d;
  text-align: left;
  padding: 0 0 0 0;
  font-weight: bold;
  text-shadow: none;
}

#c1c2 #page-data .program .place {
  display: block;
  float: right;
  clear: none;
  width: 70%;
  margin: 5px 5% 0 0;
  font: 1em "sourceit", sans-serif;
  color: white;
  text-align: left;
  padding: 0 0 0 0;
  font-weight: bold;
  text-shadow: none;
}

#c1c2 #page-data .program .alt_place {
  display: block;
  float: right;
  clear: none;
  width: 80%;
  margin: 20px 5% 0 0;
  font: 1.2em "sourceit", sans-serif;
  color: white;
  text-align: left;
  padding: 0 0 0 0;
  font-weight: bold;
  text-shadow: none;
}

#c1c2 #page-data .program .time {
  display: block;
  float: left;
  clear: both;
  width: 14%;
  margin: 1.2em 0 0 5%;
  font: 0.9em "source", sans-serif;
  color: white;
  text-align: left;
  padding: 0 0 0 0;
  font-weight: bold;
}

#c1c2 #page-data .program .ptext {
  display: block;
  float: left;
  width: 75%;
  margin: 1.2em 0 0 2%;
  font: 0.9em "source", sans-serif;
}

#c1c2 #page-data .program ul {
  display: block;
  float: left;
  width: 88%;
  margin: 3%;
  padding: 3%;
  border: 1px solid #bdbdbd;
  border-radius: 20px;
  box-shadow: inset 1px 1px 1px black;
}

#c1c2 #page-data .program li {
  display: block;
  float: left;
  clear: both;
  background-image: url("https://wikispiral.org/styles/spiral/star.png");
  background-repeat: no-repeat;
  background-size: 0.8em;
  background-position-y: 4px;
  padding: 0 0 0 1.4em;
  font-size: 0.8em;
  color: #000;
  text-shadow: 1px 1px 1px #6c6c6c;
}

#c1c2 #page-data .program li a {
  color: #000739;
}
#c1c2 #page-data .program .partners li {
  display: block;
  float: left;
  clear: both;
  background-image: url("https://wikispiral.org/styles/spiral/pentagon.png");
  background-repeat: no-repeat;
  background-size: 0.8em;
  background-position-y: 4px;
  padding: 0 0 0 1.4em;
  font-size: 0.8em;
  color: #000;
  text-shadow: 1px 1px 1px #6c6c6c;
}

#c1c2 #page-data .partners p {
  display: block;
  float: left;
  width: 90%;
  margin: 0 5% 0 5%;
  font: 0.9em "source", sans-serif;
  
}

#c1c2 #page-data .program .bandeau {
  width: 90%;
  height: auto;
  margin: 5px 5% 15px 5%;
  background: none;
}



/********** Testing *********/


/****** https://wikispiral.org/tiki-index.php?page=svg+tests *******/
/*** SMIL animated ***/

.test-svg-container {
	width: 40%;
}

#rect4160 {
    fill: #230354;
    stroke: #230354;
}

#rect4160:hover {
    fill: #D0C2E6;
    stroke: blue;
}

#a4194 {
    fill: #AFAFEC;
}

#a4194:hover {
    fill: #fff;
}


/*** Test design Responsibility measure tool : ***/

#camembert2 svg g path {
    stroke: black;
}


/* End of File */
