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

   layout.css
   Disposition des blocs principaux
   cf.: http://romy.tetue.net/structure-html-de-base

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

/* Elements principaux
------------------------------------------ */
html, body { text-align: center; background:#ddd; overflow-x:hidden }
.page { position: relative; width: 70%; max-width:95%; margin:0em auto; text-align: left;  }
/*.page { position: relative; width: 960px; max-width:95%; margin:0em auto; text-align: left;  }18*/
.header {height: 100%; background-color: #00c0f3; padding: 10px; margin: 0 -9999rem;  padding: 0.25rem 9999rem;}
.main { padding: 0;  background-image: url("http://www.ciem.ucr.ac.cr/SLI_BG.png"); }
.footer { clear: both; padding: 1em 0 0; margin:1em 0 0 0; border-top:1px solid #999; margin: 0 -9999rem;  padding: 0.25rem 9999rem; background-color: #666; padding-bottom: 15px;  padding-top: 15px;}
.slogan { clear: both; padding: 1em 0 0; margin:1em 0 0 0; border-top:1px solid #999; margin: 0 -9999rem;  padding: 0.25rem 9999rem; background-color: #F8EBC6; font-size:20px; color: #81478D; font-family: 'Montserrat'; }
.navp { clear: both; padding: 1em 0 0; margin:1em 0 0 0; border-top:1px solid #999; margin: 0 -9999rem;  padding: 0.25rem 9999rem; background-color: #81478D; font-size: 15px; margin-bottom: 25px;}

/* largeur calculee du wrapper: 960*70%  = 672px */
.wrapper { clear: both; float: left; width: 70%; overflow: hidden; font-size: 15px; margin-bottom: 20px;}
.wrapperextra { clear: both; width: 100%; overflow: hidden; border-top: dotted #000 0.5px;  margin-bottom: 25px; font-size: 15px;}
.wrapperfextra { clear: both; padding: 1em 0 0; margin:1em 0 0 0; border-top:1px solid #999; margin: 0 -9999rem;  padding: 0.25rem 9999rem; background-color: #81478D;}
.content { min-height: 350px; }

.contentart { min-height: 350px; }
.contentart p { margin-bottom: 18px; }

.content p { margin-bottom: 18px; }
/*.contentart  .spip_logo {padding: 4px; background-color: #FFF; margin-left: 0px; margin-right: 20px; border: dotted 0.5px; float: left;}18*/
.contentart  .spip_logo {padding: 4px; background-color: #FFF; margin-left: 0px; margin-right: 20px; border: dotted 0.5px; float: left; max-width:50%; width:100%;}

.contentsec  a:link: {color:#000;}
.contentsec  a:visited: {color:#000;}
.contentsec  a:active: {color:#000;}


.contentextra { }
/* largeur calculee du aside: 672px / 3 = 224px = 23.333 %*/
.asidep { float: right; width: 30%; overflow: hidden; }



.asidep .spip_logo {padding: 4px; background-color: #FFF; margin-left: 45px; border: dotted 0.5px;  }
.aside { float: right; width: 23.333%; overflow: hidden; }

/* --- Extra footer --- */

.fextra {  width: 100%;  margin: auto; }
.fextra-m1 {   float: left;  width: 0%;   height: 1px;}
.fextra-c1 {   float: left;   width: 23.44%; color: #FFFFFF; text-indent: -13px;  }
.fextra-m2 {   float: left;   width: 2.08%;   height: 1px;}
.fextra-c2 {   float: left;   width: 23.44%; color: #FFFFFF;  text-indent: -19px; }
.fextra-m3 {   float: left;   width: 2.08%;   height: 1px;  font-color: #FFFFFF; font-family: Verdana, }
.fextra-c3 {   float: left;   width: 23.44%; color: #FFFFFF;  }
.fextra-m4 {   float: left;   width: 2.08%;   height: 1px;}
.fextra-c4 {   float: left;   width: 23.44%; color: #FFFFFF;}


.menu_articlesextra h1 {
  
  font-size: 13px;
  color: #E9C31E;
  text-transform: uppercase;
  font-family: Verdana, Geneva, sans-serif;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: dotted #000 0.5px;
}

.fextra p {
  line-height: 15px;
  font-size: 10px;
    color: #FFFFFF;
  font-family: Verdana, Geneva, sans-serif;
}

.fextra h1 {
  line-height: 30px;
  font-size: 14px;
  color: #F8EBC6;
  text-transform: uppercase;
  font-family: Verdana, Geneva, sans-serif;
}

.fextra h2 {
  line-height: 30px;
  font-size: 16px;
  text-color: #FFFFFF;
  font-family: Verdana, Geneva, sans-serif;
}

.fextra h3 {
  line-height: 30px;
  font-size: 16px;
  font-family: Verdana, Geneva, sans-serif;
}

.fextra h4 {
  line-height: 30px;
  font-size: 16px;
  font-family: Verdana, Geneva, sans-serif;
}

.fextra h5 {
  line-height: 30px;
  font-size: 16px;
  font-family: Verdana, Geneva, sans-serif;
}

.fextra h6 {
  line-height: 30px;
  font-size: 12px;

  font-family: Verdana, Geneva, sans-serif;
}

.fextra a:link: {color:#FFF;}



/* Entete et barre de navigation
------------------------------------------ */
.header { padding-bottom: 1.5em;  }
.header .spip_logo_site { display: block; margin: 0; line-height: 1; font-weight: bold; font-size: 20px; }
.header .spip_logo_site,
.header .spip_logo_site a,
.header .spip_logo_site a:hover { background: transparent; text-decoration:none; color:#222; }
.header .spip_logo_site a:hover  {color:#c85000;}
.header .spip_logo_site a:hover img {opacity:0.7;}
.header .spip_logo {margin-bottom:0;}
.header #slogan { margin: 0; }

.formulaire_menu_lang { position: absolute; right: 0; top: .9em; display: block; width: 30%; }



.nav {}
.nav li {display:inline;}
.nav li a {  display: inline-block; padding-right:0.40em; margin:0.2em 0.4em 0 0; text-decoration: none;  background: #81478D; color: #E9C31E; font-family: montserrat; }
.nav li.on a { background:#E9C31E;color:#81478D;  font-weight: normal; }
.nav li a:focus,
.nav li a:hover,
.nav li a:active { background: #E9C31E; color:#81478D; }



.footer .colophon { float: left; height: 40px; width: 70%; margin: 0; margin-bottom: 20px;}
.footer .generator { float: right; }
.footer .generator a { padding: 0; background: none; }

/* Gabarit d'impression
------------------------------------------ */
@media print {
    .page,
    .wrapper,
    .content { width: auto; }
    .nav,
    .arbo,
    .aside,
    .footer { display: none; }
}

/* Affichage sur petits ecrans
Cf.: http://www.alsacreations.com/astuce/lire/1177
------------------------------------------ */

/* largeur maximum 767px */
@media (max-width: 767px) {
	body {   	width: 100%;		padding: 0 20px;	}
	.page {  	width: 100%;  	max-width: none; 	}
}

/* largeur maximum 640px */
@media (max-width: 640px) {
     /* layout */
    .wrapper,
    .content,
    .aside { width: 100%;}
    .content,
    .aside { clear: both; float: none; width: 100%; }

    /* Passer a une seule colonne (a appliquer aux elements multi-colonnes) */
    .nav ul li a { float: none; border: 0; }
    .arbo { display: none; }
    .footer .colophon { width: auto; float: none; }
    .footer .generator { display: none; }

    /* header du calendrier full-calendar */
    table.fc-header td { display: block; text-align: left; }

}

/* fin */
