/**********************************************/
/***************** CSS TERRACO ****************/

/* couleurs TERRACO: 
bleu foncé : #007dc6
bleu clair : #98c9ee
*/

/* class pour les galeries du haut */
/* il faut penser à modifier / ajouter une ligne
pour chaque nouvelle galerie. */

#cc-m-11830193025.j-gallery,
#cc-m-12146532425.j-gallery,
#cc-m-11816002125.j-gallery,
#cc-m-12210677825.j-gallery,
#cc-m-12146532425.j-gallery,
#cc-m-11830319225.j-gallery {
padding: 0px;
margin-top: 7px;
}

.mobile-only {
display: none;
}

/* #cc-m-12097851133 => DIV du footer */
#cc-m-12097851133.j-hgrid, #cc-m-12097851133 .j-hgrid {
background-color: #ADAEAD !important;
color: #EEE;
width: 95%;
margin-left: auto;
margin-right: auto;
}

#cc-m-12097851133 .cc-m-hgrid-column {
border-right: 1px solid #DDD;
width: 31.7% !important;
padding: 0px 0.5% 0px 0.5%;
}

#cc-m-12097851133 .last {
border-right: none;
}

#cc-matrix-3416345733 {
background-color: #ADAEAD;
}

/* -------------------- Arrière plan bleu sur la page d'accueil ----------------------- */
#cc-m-12522786833 {
background-color: #007dc6;
}

#cc-m-12522786833 p {
color: #FFFFFF;
}

/* -------------------- FIN   Arrière plan bleu sur la page d'accueil ----------------------- */

#cc-matrix-3416345733 h2 {
color: #FFF !important;
}


#cc-m-11816031825 .cc-m-form-note {
color: #eee;
}


/*************** FIN CSS TERRACO ***************/



/***************** CSS CONFLICTUELS ********************/
/************** A changer pour chaque site *************/
/* Malheureusement on peut pas différencier les site avec jimdo */
/* Il suffit de commenter les mauvais */
/* une solution plus propre serait de renommer les classes */

div.grey {
/* Commun aux trois */
background-color: rgba(173,174,173,0.7);
}


div.blue {
background-color: #007dc6;
}

div.blue p {
color: #FFFFFF;
}

div.blue a {
color: #FFFFFF;
}


/* Pour terraco */
h1 { font:bold 24px/140% "Trebuchet MS", Verdana, sans-serif !important; color: rgba(153, 153, 153, 1) !important; padding: 20px; padding: 10%;}
h2 { font:bold 24px/140% "Trebuchet MS", Verdana, sans-serif !important; color: #007dc6  !important; padding: 20px; padding: 10%;}
h3 { font:bold 24px/140% "Trebuchet MS", Verdana, sans-serif !important; color: #ffffff !important; background-color:#007dc6; padding: 20px; padding: 10%;text-align: center; }


div.hr {
border-bottom: 1px solid !important;

/* TERRACO */
border-color: #007dc6 !important;
}


#nav , #headnav {
/* TERRACO */
border-top: 5px solid #007dc6;


}

#nav ul.mainNav1 li, #nav ul.mainNav2 li, #headnav ul.mainNav1 li, #headnav ul.mainNav2 li
{
/* TERRACO */
    border-right: thin solid #007dc6;

  
}

#nav ul.mainNav1 li a, #nav ul.mainNav2 li a, #headnav ul.mainNav1 li a, #headnav ul.mainNav2 li a
{
/* TERRACO */
    color: #007dc6;
}


/********** CSS COMMUN ****************************/

/*****   modifs du CSS des éléments jimdo ******/
div.j-htmlCode {
padding: 0px;
}

div.n, div.flexmodul {
padding: 0px;
}

div.j-text, div.j-header {
margin-left: 5px;
margin-right: 5px;
}


div.decal {
 padding: 1%;
 padding-left: 5%;
 padding-right: 5%;
}


/* ajout Carl pour gestion des sous-titres des images */
div.bx-caption {
    display: none;
    }



/*  Typo
----------------------------------------------- */

/* désactiver par Carl pour uniformisation (fonction style de jimdo)
p a:link, p a:visited,
h2 a:link, h2 a:visited {
    text-decoration: underline;
    color:#FEE !important;
}
 a:active { 	text-decoration: underline; }
 a:hover { text-decoration:none; }
*/



p {	font: 11px/140% Verdana, Geneva, Arial, Helvetica, sans-serif; padding: 10%;}

/*  Layout
----------------------------------------------- */

body {
    background: #fff url(https://u.jimcdn.com/cms/o/sc1ea41b5733a547d/userlayout/img/plan-archi-4-2.jpg?t=1467273466) no-repeat fixed top center;
    padding:35 0 0 0;
    margin:0;
    font: 11px/140% Verdana, Geneva, Arial, Helvetica, sans-serif;
}

#container
{
    margin:0 auto;
    /* width: 834px; */
    width:100%;
    max-width: 1920px;
}

#header
{
    padding:0px;
}

#header h1,
#header a
{
    padding:0;
    font-family:"Helvetica","Lucida Sans Unicode",Tahoma,Verdana,Arial,Helvetica,sans-serif;
    font-size:30px;
    font-weight:normal;
    text-decoration:none;
    line-height:1.3em;
    color:#666666;
    text-align:right;
}

#header a:hover { text-decoration:none;  }


#navigation
{
    float:left;
    width:220px;
    padding:17px;

}
#sidebar
{
    padding-top:10px;
}

#content
{
    width:100%;
    padding:0px;
    margin-left: auto;
    margin-right: auto;
    margin-top:-7px;
}

#footer
{
    clear:both;
    margin-top:10px;
    height:65px;
}

#footer .gutter 
{
    height:30px;
    padding:35px 15px 0 90px;
    background-color: #ADADAD;
}

#footer .gutter a {
    color: #eee;
}


#footer A:Link {
    color: #eee;
}


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




/* perso */

/* menu du haut, logo et bouton */
#nav , #headnav {
width: 100%;
text-align: right;
background-color: #ADAEAD;
border-bottom: 5px solid #ADAEAD;
}

#nav .logo , #headnav .logo {
height: 45px;
margin-top: 2px;
float: left;
}

#nav ul.mainNav1,
#nav ul.mainNav2,
#headnav ul.mainNav1,
#headnav ul.mainNav2
{
    padding: 0;
    max-height: 150px;
    height: 45px;
    padding-right: 0px;
 margin-bottom: 0px;

}


#nav ul.mainNav1 li,
#nav ul.mainNav2 li,
#headnav ul.mainNav1 li,
#headnav ul.mainNav2 li
{
    display: inline-block;
    margin: 0px;
    padding: 4px 40px;
}

#nav ul.mainNav1 li:last-child,
#nav ul.mainNav2 li:last-child,
#headnav ul.mainNav1 li:last-child,
#headnav ul.mainNav2 li:last-child {
border-right: none;
}


#nav ul.mainNav1 li a,
#nav ul.mainNav2 li a,
#headnav ul.mainNav1 li a,
#headnav ul.mainNav2 li a
{
    font:normal 14px/140% Verdana, Geneva, Arial, Helvetica, sans-serif !important;
    text-decoration: none;
    display: block;
}


#nav ul.mainNav1 li a,#headnav ul.mainNav1 li a { padding:4px 4px 4px 4px; }
#nav ul.mainNav2 li a,#headnav ul.mainNav2 li a { padding:4px 4px 4px 14px; }
#nav ul.mainNav3 li a,#headnav ul.mainNav3 li a { padding:4px 4px 4px 24px; }


#nav ul.mainNav1 a.current,#headnav ul.mainNav1 a.current { font-weight:bold; }

/* menu "images" du haut et du bas */

#mynav,#mybottomnav {
width: 100%;
overflow-x: hidden;
background-color: white;
}

/* pour un content a 70% */
/*
#mynav {
width: 125%;
margin-left: -12.5%;
}
*/

#mybottomnav {
background-color: #ADAEAD;
}

#mynav ul.menu,#mybottomnav ul.menu {
list-style: none;
padding: 0px;
 margin-top: 0px;
 margin-bottom: 0px;
}

#mynav ul li.menuitem,#mybottomnav ul li.menuitem {
display: inline-block;
width: 20%;
max-width: 384px;
height: 600px;
padding: 0px;
margin:0px;
margin-right: -4px;
transition-property: opacity;
transition-timing-function: ease; 
transition-duration: 0.2s;
background-position: top right;
background-repeat: no-repeat;
background-size: cover;
overflow: hidden;
color: #FFF !important;
text-shadow: 1px 1px 1px #000;
}

#mybottomnav ul li.menuitem {
height: 50px;
background-position: bottom left;
}


#mynav ul li h1, #mybottomnav ul li h1 {
display: block;
height: 100%;
position: relative;
font-size: 1.2em !important;
}

#mynav ul li h1 a, #mybottomnav ul li h1 a {
text-decoration: none;
padding-left: 4px;
text-align: left;
display: block;
position: absolute;
bottom: 0px;
padding-top: 500%;
width: 99%;
color: #FFF
}

#mybottomnav ul li h1 a {
padding-top: 20%;
}












/**** CSS MOBILE COMMUN ****/


@media screen and (max-width: 800px) {

  #sidebar {
  display: none;
  }

  #footer {
  margin: 0px;
  }

  header h1 {
  width: 100%;
  }

  .logo {
  display: none;
  }

  #mynav ul {
  margin: 0px;
  padding: 0px;
  text-align: center;
  }

  #mynav ul li.menuitem {
  background: none !important;
  list-style-type: none;
  font-size: 0.6em;
  display: block;
  background-color: #555 !important;
  border: thin solid #aaa;
  text-align: left;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 5px;
  height: 32px;
  width: 100%;
  max-width: initial;
  color: #FFF !important;
  }

  #mynav ul a {
  color: #eee;
  text-decoration: none; 
  }

  #mynav ul a::after {
  content: ">";
  position: absolute;
  right: 10px;
  }

      #nav ul.mainNav1 {
	  padding: 0px;
	  min-height: 50px;
	  height: auto;
      }

      
      
  /* Titre 3eme colonne footer */
  #cc-m-header-12239542733 h2 {
  font-size: 12px !important;
  }

  #cc-matrix-3281947625 p, #cc-matrix-3281947625 span {
  font-size: 10px !important;
  }
}