/**
 * @file
 * Styles are organized using the SMACSS technique. @see http://smacss.com/book/
 *
 * When you turn on CSS aggregation at admin/config/development/performance, all
 * of these @include files will be combined into a single file.
 */

/* HTML element (SMACSS base) rules */
@import "normalize.css";

/* Layout rules */
@import "layouts/responsive.css";

/* Component (SMACSS module) rules */
@import "components/misc.css";
/* Optionally, add your own components here. */
@import "print.css";

/* SMACSS theme rules */
/* @import "theme-A.css"; */
/* @import "theme-B.css"; */


body {
    color: #003756. /*#666;*/
    background: #fff;
    -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale; 
	font-family: "Ubuntu",Verdana, Tahoma, "DejaVu Sans", sans-serif;
}

#page {
  margin-left: auto;
  margin-right: auto;
  min-width: 100%;
  font-family: "Ubuntu",Verdana, Tahoma, "DejaVu Sans", sans-serif;
}

#main {
  max-width: 1200px;
  margin: 0 auto;
  background-color:#fff;
  font-family: "Ubuntu",Verdana, Tahoma, "DejaVu Sans", sans-serif;
}

.header {
  max-width: 1200px;
  margin: 0 auto;
  background-color:#fff;
}


#contactban {
    background-image: linear-gradient(to right, #007dc5, black) !important;
	width: 100%;
	background: #007dc5;
	color:#fff;
	text-align: right;
}
 .baspage {
    background-image: linear-gradient(to right, #007dc5, black) !important;
	min-width: 100%;
	background: #007dc5;
	color:#fff;
	padding:50px 0px 50px 0px
}

#contactban1 {
	  margin-left: auto;
  margin-right: auto;
  max-width: 1200px;
  padding: 5px
}

.spacing-left {
    padding-left: 20px;
}

#contactban1 a {
text-decoration: none;
font-weight: bold;
color: #0090D3;
font-size: 90%
}

#contactban1 a:hover {
color: #4D4D4D
}


.header__logo-image {
    vertical-align: bottom;
}


.header__logo {
  float: left; /* LTR */
  margin: 0;
  padding: 20px;
}

/* Logo image. */
.header__logo-image {
  vertical-align: bottom;
    width: 200px !important;
}

#worldmap {
  background-image: url("/sites/default/files/earth_resize.jpg");
  background-color: #000; 
  height: 550px; /* You must set a specified height */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
}



.menu /* Ensemble du menu */
{
        padding : 0; /* pas de marge intérieure */	
		width: 890px; /* 920px */
		 margin: 0 auto; /* ni extérieure */
		background-color:#007dc5;
        list-style : none; /* on supprime le style par défaut de la liste */
        line-height : 21px;  on définit une hauteur pour chaque élément */
        text-align : center; /* on centre le texte qui se trouve dans la liste */		
        font-size : 12px; /* hauteur du texte : 12 pixels */ 
		color : #fff; /* couleur du texte */
	
}

.menu a /* Contenu des listes */
{
        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding: 20px; /* aucune marge intérieure */      
        color : #fff; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
		/* width : 200px;    largeur */	
		font-size: 130%;	
		background-color:#007dc5;
}

.menu .is-active a {
		color: #fff;
		background-color:#006AA6
}


.menu ul /* Liste */     
{
        padding-top : 10px; /* pas de marge intérieure */
        margin : 0; /* ni extérieure */
        list-style : none; /* on supprime le style par défaut de la liste */
        /*line-height : 21px;  on définit une hauteur pour chaque élément */
        text-align : left; /* on centre le texte qui se trouve dans la liste */
		/* width : 120px;    largeur */
	
	
}


.menu li /* Elements des listes */      
{ 
        float: left;
        /* pour IE qui ne reconnaît pas "transparent" */
		background-color: transparent; /* couleur de fond */ 
		color: #fff;
		border: 0px;
		margin: 0px;
		/* width: 200px; */
}

.menu ul a/* Elements des listes */      { 
		width: 300px;
}

.menu li span.nolink /* Elements des listes */       { 

		        display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
        padding: 20px; /* aucune marge intérieure */      
        color : #fff; /* couleur du texte */
        text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
		/* width : 200px;    largeur */	
		font-size: 130%;	
		background-color:#007dc5;
}

.menu__item.is-expanded {
    list-style-image: none;
    list-style-type: none;	
}


.menu li ul /* Sous-listes */
{ 
        position: absolute; /* Position absolue */
		z-index:1000;
        width: 300px;  /* Largeur des sous-listes */
        left: -999em;  /* Hop, on envoie loin du champ de vision */
		/*border: 2px solid red CONTOUR ICI */
		margin-top: -10px

}


.menu li ul li /* Éléments de sous-listes */
{
        /* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
        /* border-top : 1px solid #fff;  on met une bordure blanche en haut de chaque élément d'une sous liste */ 
		border-left: 0px solid #AFCB08;
		
}

/* IE ne reconnaissant pas le sélecteur ">" */
html>body .menu li ul li                
{
        /*border-top : 1px solid transparent;  on met une bordure transparente en haut de chaque élément */
}

.menu li ul ul 
{
        /* margin    : -22px 0 0 120px ;  On décale les sous-sous-listes pour qu'elles ne soient pas au dessus des sous-listes */ 
        /* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
        border-left     : 1px solid #fff ; /* Petite bordure à gauche pour ne pas coller ... */    	
}

/* IE ne reconnaissant pas le sélecteur ">" ... je me répète ;-) */
html>body .menu li ul ul                
{
        border-left     : 1px solid transparent ; /* on met une bordure transparente sur la gauche de chaque élément */
}

.menu a:hover /* Lorsque la souris passe sur un des liens */    
{
        color: #fff; /* On passe le texte en noir... */
        background-color: #006AA6; /* ... et au contraire, le fond en blanc */
		transition-duration: 0.5s;
		transition-property: color;
		transition-property: background-color;
}



.menu li:hover ul ul, 
.menu li.sfhover ul ul /* Sous-sous-listes lorsque la souris passe sur un élément de liste */ {
        left: -999em; /* On expédie les sous-sous-listes hors du champ de vision */
}


.menu li:hover ul, 
.menu li li:hover ul, 
.menu li.sfhover ul, 
.menu li li.sfhover ul  /* Sous-listes lorsque la souris passe sur un élément de liste ET sous-sous-lites lorsque la souris passe sur un élément de sous-liste */
{
        left: auto; /* Repositionnement normal */
        min-height: 0; /* Corrige un bug sous IE */
}


.menu__item.is-leaf {
    list-style-image: none;
    list-style-type: none;
}

.button {
    padding: 20px;
    border-radius: 0.1875rem;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
    background-color: #ffff;
    color: #006AA6;
    border: 0;
    line-height: 1.5;
    font-size: 1rem;
    vertical-align: middle;
    text-shadow: none;
    -webkit-transition: background 0.1s;
    -moz-transition: background 0.1s;
    transition: background 0.1s;
	text-decoration:none;

}



.button:hover /* Lorsque la souris passe sur un des liens */    
{
        color: #fff; /* On passe le texte en noir... */
        background-color: #006AA6; /* ... et au contraire, le fond en blanc */
		transition-duration: 0.5s;
		transition-property: color;
		transition-property: background-color;
}

.view-objectifs-fr,
.view-objectifs-en {
	background-color: #003C5E;
	width: 600px;
	margin: 0 auto;
	color: #fff;
	padding: 20px;
	text-align: justify;
	box-shadow: 5px 5px 5px 0px #006AA6
}

.view-objectifs-fr a,
.view-objectifs-en a {
	color: #fff;
	text-decoration: none
}

.view-objectifs-fr a:hover,
.view-objectifs-en a:hover {
	color: #007dc5;
	text-decoration: none;
	    -webkit-transition: color 0.1s;
    -moz-transition: color 0.1s;
    transition: color 0.1s;
}

.view-specific-node a {
	color: #007dc5;
	text-decoration: none
}

.view-specific-node a:hover {
	color: #fff;
	text-decoration: none;
	    -webkit-transition: color 0.1s;
    -moz-transition: color 0.1s;
    transition: color 0.1s;
}

.hvr-grow {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
    z-index:12;
}

.imagesat {
	width:900px;
  height:270px;
	transition: all 5s ease;
  -moz-transition: all 5s ease;
  -ms-transition: all 5s ease;
  -webkit-transition: all 5s ease;
  -o-transition: all 5s ease;
} 
.imagesat:hover {
  transform: scale(1.5);
  -moz-transform: scale(1.5);
  -webkit-transform: scale(1.5);
  -o-transform: scale(1.5);
  -ms-transform: scale(1.5); /* IE 9 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand')"; /* IE8 */
   filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand'); /* IE6 and 7 */ 
} 

.allblocks .menu li span.nolink /* Elements des listes */       { 
		color: #fff;
		background-color:#006AA6
}

.allblocks {
	padding-bottom: 50px;
	overflow: auto;
	max-width:1200px;
	margin: 0 auto;
	text-align: justify;
}

.field-name-body {
	text-align: justify;
}


.leftblocks {
	padding-bottom: 50px;
	overflow: auto;
	max-width:590px;
	float: left
}


.rightblocks {
	padding-bottom: 50px;
	overflow: auto;
	max-width:590px;
	float: right;
}
	
.allblocks a {
    color: #007dc5;
	text-decoration: none;

}

.allblocks a:hover {
    color: #666;
}

.leftblocksbis {
	padding-bottom: 50px;
	overflow: auto;
	max-width:390px;
		float: left
}

.rightblocksbis {
	padding-bottom: 50px;
	overflow: auto;
	max-width:890px;
	float: right;
}

.ressources {
width:100%;
font-size: 80%;
margin-bottom:50px
}

.ressources td {
width:50%;
border: 1px solid #eaeaea;
padding: 10px
}

.ressources th {
width:50%;
border: 1px solid #eaeaea;
padding: 10px;
background: #f7f7f7;
}

#navigationz {
  max-width: 200px;
  list-style: none;
  margin: 0;
  padding: 0;
}

#navigationz {
  max-width: 200px;
  list-style: none;
  margin: 0;
  padding: 0;
}

#navigationz a {
    color: #007dc5;
	text-decoration: none;

}

#navigationz a:hover {
    color: #666;
}

#navigationz li {
  background: #fff ;
  border: 1px solid #eaeaea;
}

#navigationz li a {
  display: block ;
  background: #fff ;
  line-height: 30px ;
  text-decoration: none ;
  padding: 10px ;
}

#navigationz li a:hover, #navigation li a:focus, #navigation li a:active {
  background: #F8F9FA ;
  text-decoration: none;
}

.missiontabs {
width:100%
}

.missiontabs td {
	vertical-align: top;
	padding: 10px
}

.missiontabs a {
text-decoration: none;
font-weight: bold;
color: #0090D3;
font-size: 90%
}

.missiontabs a:hover {
color: #4D4D4D
}

.soutienlist {
width:1200px;
margin: 0 auto;
font-size:90%
}

.soutienlist td {
width:25%;
vertical-align:top;
padding:10px
}

.soutienlist a {
text-decoration: none;
font-weight: bold;
color: #0090D3;
font-size: 90%
}

.soutienlist a:hover {
color: #4D4D4D
}

.partnerpage {
	background-color:#f4f4f4;
	padding:20px;
	border-radius:10px
}

.partnerpage a {
text-decoration: none;
font-weight: bold;
color: #0090D3;
font-size: 90%
}

.partnerpage a:hover {
color: #4D4D4D
}

.boxshadow img {
    box-shadow: 5px 5px 5px 0px #cfcfcf;
}