* {
  border: none;
  margin: 0px;
  padding: 0px;
  text-decoration: none;
}

html {
  font-size: 100%;
  height: 100%;
}

body {
  background-color: white;
  font: 0.75em/115% "Arial", verdana, helvetica, sans-serif;
  color: black;
  height: 100%;
}

#layout {
  position: relative;
  width: 100%;
  min-height: 100%;
}

/* ###################### HEADER #######################################################" */

#header {
 position: relative;
 width: 1100px;
 height: 409px;
 margin: auto;
}

#header a.suc
{
    position: absolute;
    top: 0px;
    right: 0px;
    width: 1010px;
    height: 339px;
}

#header a.clermont-u
{
    position: absolute;
    top: 10px;
    left: 0px;
    width: 88px;
    height: 36px;
}

#header a.ministere-culture
{
    position: absolute;
    top: 64px;
    left: 0px;
    width: 40px;
    height: 50px;
}

#header a big
{
    display: none;
}

#header #search-form {
  position: absolute;
  bottom: 50px;
  right: 0px;
  height: 20px;
  width: 190px;
}

#header #search-form #search_keywords {
  position: absolute;
  bottom: 0px;
  left: 0px;
  border: 1px solid #e3e3e3;
  padding: 3px;
  width: 150px;
  font-size: 12px;
  color: #cecece;
}

#header #search-form input.search-button {
  position: absolute;
  bottom: 0px;
  right: 0px;
}


#layout.suc #header {
 background: url("/images/header-suc.jpg") no-repeat top left;
}

#layout.action-culturelle #header {
 background: url("/images/header-actions-culturelles.jpg") no-repeat top left;
}

#layout.arts-plastiques #header {
 background: url("/images/header-arts-plastiques.jpg") no-repeat top left;
}

#layout.arts-de-la-scene #header {
 background: url("/images/header-arts-de-la-scene.jpg") no-repeat top left;
}

#layout.cinema #header {
 background: url("/images/header-cinema.jpg") no-repeat top left;
}

#layout.lire-ecrire #header {
 background: url("/images/header-lire-ecrire.jpg") no-repeat top left;
}

#layout.musique #header {
 background: url("/images/header-musique.jpg") no-repeat top left;
}

/* ###################### QUICK LINKS #######################################################" */
#quick_links ul {
  margin-top: -10px;
}

#quick_links ul li{
  margin-top: 5px;
}

#quick_links ul li img{
  vertical-align: -5px;
}

#quick_links a {
  font-size: 13px;
  color: #3c3c3c;
}


/* ###################### TOP MENU #######################################################" */
#top-menu
{
  position: relative;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 42px;
  background: url("/images/top-menu-background.jpg") repeat-x top left;
}

#top-menu ul
{
  width: 1100px;
  margin: auto;
  display: block;
  padding: 0px 0px 0px 150px;
}

#top-menu ul li
{
  list-style-type: none;
  display: block;
  float: left;
  height: 42px;
}

#top-menu ul li a
{
  display: block;
  position: relative;
  top: 0px;
  float: left;
  height: 42px;
  padding: 0px 15px 0px 15px;
}

#top-menu ul li a.action-culturelle {
  width: 146px;
  background: url("/images/btn-actions-culturelles.jpg") no-repeat top left;
}

#top-menu ul li a.arts-plastiques {
  width: 125px;
  background: url("/images/btn-arts-plastiques.jpg") no-repeat top left;
}

#top-menu ul li a.arts-de-la-scene {
  width: 135px;
  background: url("/images/btn-arts-de-la-scene.jpg") no-repeat top left;
}

#top-menu ul li a.lire-ecrire {
  width: 96px;
  background: url("/images/btn-lire-ecrire.jpg") no-repeat top left;
}

#top-menu ul li a.musique {
  width: 84px;
  background: url("/images/btn-musique.jpg") no-repeat top left;
}

#top-menu ul li a.cinema {
  width: 81px;
  background: url("/images/btn-cinema.jpg") no-repeat top left;
}

#top-menu ul li a.active {background-position: 0 -42px;}

#top-menu ul li a.button:link {background-position: 0 0;}     /* unvisited link */
#top-menu ul li a.button:visited {background-position: 0 0;}  /* visited link */
#top-menu ul li a.button:hover {background-position: 0 -42px;}     /* unvisited link */
#top-menu ul li a.button:active {background-position: 0 -42px;}  /* visited link */

#top-menu ul li a.active {background-position: 0 -42px;}

#top-menu ul li a span {
  display: none;
}

/* ###################### CONTENT (LEFT + CENTER) ####################################### */
#content {
  position: relative;
  width: 1100px;
  margin: auto;
  overflow: hidden;
  padding-bottom: 290px;
  height: 100%;
}

/* ###################### LEFT COLUMN #######################################################" */
#left {
 float: left;
 width: 230px;
}

#left h1 {
  height: 30px;
  color: #4e4e4e;
  font-size: 17px;
  background: url("/images/left-hr.jpg") no-repeat bottom left;
  margin-bottom: 20px;
}

/* ###################### DATE VIGNETS #######################################################" */
span.date {
  width: 51px;
  height: 58px;
  background: url("/images/date-vignet.jpg") no-repeat top left;
  text-align: center;
  color: white;
  text-transform: uppercase;
  padding-top: 8px;
}

span.date span {
  display: block;
  font-size: 14px;
  padding: 0px;

}

span.date span b {
  display: block;
  font-size: 26px;
  margin-bottom: 5px;
  font-weight: normal;
}

span.date span small {
  font-size: 9px;
  text-transform: none;
}

div.agenda-entry.action-culturelle a:hover span.date, #layout.action-culturelle #center span.date { background: url("/images/date-vignet-actions-culturelles.jpg") no-repeat top left; }
div.agenda-entry.arts-de-la-scene a:hover span.date, #layout.arts-de-la-scene #center span.date { background: url("/images/date-vignet-arts-de-la-scene.jpg") no-repeat top left; }
div.agenda-entry.musique a:hover span.date, #layout.musique #center span.date { background: url("/images/date-vignet-musique.jpg") no-repeat top left; }
div.agenda-entry.arts-plastiques a:hover span.date, #layout.arts-plastiques #center span.date { background: url("/images/date-vignet-arts-plastiques.jpg") no-repeat top left; }
div.agenda-entry.cinema a:hover span.date, #layout.cinema #center span.date { background: url("/images/date-vignet-cinema.jpg") no-repeat top left; }
div.agenda-entry.lire-ecrire a:hover span.date, #layout.lire-ecrire #center span.date { background: url("/images/date-vignet-lire-ecrire.jpg") no-repeat top left; }

/* ###################### AGENDA #######################################################" */
#agenda {
  width: 228px;
  margin-bottom: 20px;
}

#agenda a.button {
  display: block;
  color: #7d7d7d;
  font-size: 12px;
  font-style: italic;
  text-align: left;
  margin-top: -10px;
  width: 100%
}

#agenda div.agenda-entry span.date{
  float: left;
}

#agenda div.agenda-entry {
  margin-top: 7px;
  height: 82px;
  background: url("/images/left-hr.jpg") no-repeat bottom left;
  margin-bottom: 10px;
}

#agenda div.agenda-entry a {
  width: 100%;
  height: 100%;
}

#agenda div.agenda-entry big {
  display: block;
  margin-left: 63px;
  font-size: 12px;
  font-weight: bold;
  line-height: 105%;
  color: black;
}

#agenda div.agenda-entry dfn {
  display: block;
  margin-left: 63px;
  text-align: left;
  font-size: 12px;
  color: #7d7d7d;
  margin-top: 2px;
}

#agenda div.agenda-entry dfn span.link {
  display: block;
  text-align: left;
  font-size: 12px;
  font-style: italic;
  margin-top: 2px;
  width: 100%;
  height: 100%;
  color: #555555;
}

#agenda div.agenda-entry.action-culturelle a:hover dfn span.link, #agenda div.agenda-entry.action-culturelle a:hover big { color: #007bb8; }
#agenda div.agenda-entry.arts-de-la-scene a:hover dfn span.link, #agenda div.agenda-entry.arts-de-la-scene a:hover big  { color: #b50a66; }
#agenda div.agenda-entry.musique a:hover dfn span.link, #agenda div.agenda-entry.musique a:hover big  { color: #6ab023; }
#agenda div.agenda-entry.arts-plastiques a:hover dfn span.link, #agenda div.agenda-entry.arts-plastiques a:hover big  { color: #d8ca24; }
#agenda div.agenda-entry.cinema a:hover dfn span.link, #agenda div.agenda-entry.cinema a:hover big  { color: #ff9900; }
#agenda div.agenda-entry.lire-ecrire a:hover dfn span.link, #agenda div.agenda-entry.lire-ecrire a:hover big  { color: #b50a66; }

/* ###################### CENTER COLUMN #######################################################" */
#center {
  position: relative;
  margin-left: 283px;
  width: 817px;
}

#center h1 {
  font-size: 17px;
  height: 30px;
  color: #4e4e4e;
  background: url("/images/content-hr.jpg") no-repeat bottom left;
  margin-top: 0px;
}

#center p {
  font-size: 12px;
  color: #7d7d7d;
  margin-top: 15px;
  text-align: justify;
  line-height: 150%;
  margin-bottom: 15px;
}

#center #search p {
  margin-bottom: 20px;
}

#center ul {
  padding: 0px;
  margin: 0px;
}

#center ul li {
  position: relative;
  left: 25px;
  font-size: 12px;
  color: #7d7d7d;
}

#center #sector h1 {
  width: 817px;
  height: 60px;
  font-size: 1px;
  color: white;
  margin-top: 0px;
  text-indent: -100em;
  overflow: hidden;
  line-height: 105%;
}

#center #sector #links {
  position: absolute;
  top: 28px;
  right: 0px;
  width: 350px;
  height: 20px;
  font-size: 17px;
  text-align: right;
}

#center #sector #links a{
  color: #4e4e4e;
  font-weight: 600;
}

#center #sector #links img{
  vertical-align: middle;
}

/* ----------------- SECTOR ------------------------------------------------- */
#center #sector #workshops {
  margin-top: 21px;
}


/* ----------------- WORKSHOPS ------------------------------------------------- */
#center #sector #workshops div.workshop {
  width: 375px;
  height: 126px;
  margin-top: 14px;
  overflow: hidden;
}

#center #sector #workshops div.workshop a{
  width: 100%;
  height: 100%;
}

#center #sector #workshops div.workshop.left {
  float: left;
}

#center #sector #workshops div.workshop.right {
  float: right;
}

#center #sector #workshops div.workshop img {
  float: left;
  margin-right: 10px;
}

#center #sector #workshops div.workshop big {
  font-size: 23px;
  color: #4e4e4e;
  line-height: 105%;
  display: block;
  font-weight: bold;
}

#center #sector #workshops dfn {
  display: block;
  margin-top: 2px;
  line-height: 115%;
  font-style: normal;
  color: #7d7d7d;
}

#center #sector #workshops div.workshop dfn span.highlight {
  font-size: 12px;
  font-style: italic;
  display: block;
}

/* ----------------- EVENTS ------------------------------------------------- */

#center #sector #events div.event {
  width: 245px;
  height: 250px;
  margin-top: 14px;
  background-color: #fafafa;
  border: 1px solid #ececec;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -khtml-border-radius: 10px;
  border-radius: 10px;
  behavior: url("/css/border-radius.htc");
  padding: 10px;
  margin-right: 5px;
  float: left;
  overflow: hidden;
}

#center #sector #events div.event a {
  width: 100%;
  height: 100%;
}

#center #sector #events div.event big {
  display: block;
  font-size: 19px;
  margin: 0px 0px 0px 60px;
  color: #4e4e4e;
  line-height: 105%;
  font-weight: bold;
}

#center #sector #events div.event big.partner_event {
  margin: 0px 0px 10px 0px;
}


#center #events div.event dfn {
  margin-top: 8px;
  line-height: 110%;
  font-style: normal;
  color: #7d7d7d;
  display: block;
}


#center #sector #events div.event dfn span.highlight {
  font-size: 12px;
  font-style: italic;
  display: block;
  margin-top: 5px;
}

#center #sector #events div.event span.date {
  float: left;
  margin: 0px;
}

#center #sector #events div.event img {
  margin-left: 12px;
}

/* ----------------- ZOOM ------------------------------------------------- */
#center #zoom {
  position: relative;
  height: 290px;
}

#center #zoom div.zoom-entry {
  width: 237px;
  height: 207px;
  margin-top: 14px;
  background-color: #fafafa;
  border: 1px solid #ececec;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -khtml-border-radius: 10px;
  border-radius: 10px;
  behavior: url("/css/border-radius.htc");
  padding: 12px;
}

#center #zoom div.zoom-entry.slot_0 {
  position: absolute;
  top: 25px;
  left: 0px;
}

#center #zoom div.zoom-entry.slot_1 {
  position: absolute;
  top: 25px;
  left: 278px;
}

#center #zoom div.zoom-entry.slot_2 {
  position: absolute;
  top: 25px;
  left: 553px;
}

#center #zoom div.zoom-entry a {
  width: 100%;
  height: 100%;
}

#center #zoom div.zoom-entry big {
  display: block;
  font-size: 15px;
  font-weight: bold;
  margin-top: 15px;
  color: #2fbdce;
}

#center #zoom div.zoom-entry dfn {
  display: block;
  text-align: left;
  font-size: 12px;
  color: #7d7d7d;
  margin-top: 5px;
  font-style: normal;
  font-weight: 600;
}

/* ----------------- WORKSHOP ------------------------------------------------- */
#center #workshop {
  background-color: #fafafa;
  border: 1px solid #ececec;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -khtml-border-radius: 10px;
  border-radius: 10px;
  behavior: url("/css/border-radius.htc");
  margin-top: 24px;
  padding: 24px;
}

#center #workshop h2 {
  margin-top: 15px;
  font-size: 23px;
  color: #4e4e4e;
  line-height: 105%;
}

#center #workshop p span.highlight strong {
  font-size: 110%;
}

/* ----------------- EVENT ------------------------------------------------- */
#center #event {
  margin: 24px 25px 0px 0px;
}

#center #event h2 {
  margin-top: 15px;
  font-size: 23px;
  color: #4e4e4e;
  margin-right: 60px;
  display: inline;
  line-height: 105%;
}

#center #event #event-image {
  float: left;
  width: 345px;
}

#center #event span.date {
  float: right;
  margin: 0px 0px 0px 10px;
}

/* ============================== COULEURS & FOND SPECIFIQUES AUX DIFFÉRENTS SECTEURS =============================================== */

/* #layout.action-culturelle #sector div.coloured h2 { color: #007bb8; } */
#layout.action-culturelle #sector div.coloured p a { color: #007bb8; }
#layout.action-culturelle #center h1 { background: url("/images/sector-header-actions-culturelles.jpg") no-repeat top right; }
#layout.action-culturelle #sector div.workshop { background: url("/images/ws-footer-actions-culturelles.jpg") no-repeat bottom left; }

/* #layout.arts-de-la-scene #sector div.coloured h2 { color: #b50a66; } */
#layout.arts-de-la-scene #sector div.coloured p a { color: #b50a66; }
#layout.arts-de-la-scene #center h1 { background: url("/images/sector-header-arts-de-la-scene.jpg") no-repeat top right; }
#layout.arts-de-la-scene #sector div.workshop { background: url("/images/ws-footer-arts-de-la-scene.jpg") no-repeat bottom left; }

/* #layout.musique #sector div.coloured h2 { color: #6ab023; } */
#layout.musique #sector div.coloured p a { color: #6ab023; }
#layout.musique #center h1 { background: url("/images/sector-header-musique.jpg") no-repeat top right; }
#layout.musique #sector div.workshop { background: url("/images/ws-footer-musique.jpg") no-repeat bottom left; }

/* #layout.arts-plastiques #sector div.coloured h2 { color: #d8ca24; } */
#layout.arts-plastiques #sector div.coloured p a { color: #d8ca24; }
#layout.arts-plastiques #center h1 { background: url("/images/sector-header-arts-plastiques.jpg") no-repeat top right; }
#layout.arts-plastiques #sector div.workshop { background: url("/images/ws-footer-arts-plastiques.jpg") no-repeat bottom left; }

/* #layout.cinema #sector div.coloured h2 { color: #ff9900; } */
#layout.cinema #sector div.coloured p a { color: #ff9900; }
#layout.cinema #center h1 { background: url("/images/sector-header-cinema.jpg") no-repeat top right; }
#layout.cinema #sector div.workshop { background: url("/images/ws-footer-cinema.jpg") no-repeat bottom left; }

/* #layout.lire-ecrire #sector div.coloured h2 { color: #b50a66; }  */
#layout.lire-ecrire #sector div.coloured p a { color: #b50a66; }
#layout.lire-ecrire #center h1 { background: url("/images/sector-header-lire-ecrire.jpg") no-repeat top right; }
#layout.lire-ecrire #sector div.workshop { background: url("/images/ws-footer-lire-ecrire.jpg") no-repeat bottom left; }

#layout.suc #center p a,
#layout.suc span.highlight,
#layout.suc span.highlight a {
 color: #2fbdce;
}

#layout.action-culturelle #center p a,
#layout.action-culturelle span.highlight,
#layout.action-culturelle span.highlight a {
  color: #007bb8;
}

#layout.arts-de-la-scene #center p a,
#layout.arts-de-la-scene span.highlight,
#layout.arts-de-la-scene span.highlight a {
 color: #b50a66;
}

#layout.musique #center p a,
#layout.musique span.highlight,
#layout.musique span.highlight a {
  color: #6ab023;
}

#layout.arts-plastiques #center p a,
#layout.arts-plastiques span.highlight,
#layout.arts-plastiques span.highlight a {
 color: #d8ca24;
}

#layout.cinema #center p a,
#layout.cinema span.highlight,
#layout.cinema span.highlight a {
 color: #ff9900;
}

#layout.lire-ecrire #center p a,
#layout.lire-ecrire span.highlight,
#layout.lire-ecrire span.highlight a {
 color: #b50a66;
}

/* ###################### FOOTER #######################################################" */
#footer {
  position: absolute;
  bottom: 0px;
  width: 100%;
  height: 258px;
  background: url("/images/footer.jpg") repeat-x top left;
  clear:both;
}

#footer .content {
  position: relative;
  width: 1100px;
  height: 258px;
  margin: auto;
}

#footer p{
  position: absolute;
  font-size: 9px;
  font-weight: bold;
  color: #9d9d9d;
  top: 180px;
  left: 5px;
}

#footer p a{
  color: #9d9d9d;
  font-weight: bolder;
}

#footer a.agreestudio
{
    position: absolute;
    bottom: 0px;
    right: 0px;
    width: 33px;
    height: 76px;
    overflow: hidden;
    text-indent: -100em;
}

#footer #footer_links
{
  margin-left: 230px;
}

#footer div.links 
{
  float:left;
  margin-top: 135px;
  margin-left: 40px;
}

#footer div.links ul
{
  list-style-type: none;
  margin-top: 5px;
}

#footer div.links ul li a
{
  color: #838383;
  font-size: 12px;
}

#footer div.links ul li a:hover, #footer div.links ul li a:active {
  color: #AAAAAA;
}

#footer div.links h1
{
  color: #838383;
  font-size: 14px;
  height: 22px;
  background: url("/images/footerlinks_background.jpg") no-repeat bottom left;
}




#layout.suc #footer .content{
  background: url("/images/footer-suc.jpg") no-repeat top left;
}

#layout.action-culturelle #footer .content{
  background: url("/images/footer-actions-culturelles.jpg") no-repeat top left;
}

#layout.arts-plastiques #footer .content{
  background: url("/images/footer-arts-plastiques.jpg") no-repeat top left;
}

#layout.arts-de-la-scene #footer .content {
  background: url("/images/footer-arts-de-la-scene.jpg") no-repeat top left;
}

#layout.lire-ecrire #footer .content {
  background: url("/images/footer-lire-ecrire.jpg") no-repeat top left;
}

#layout.musique #footer .content {
  background: url("/images/footer-musique.jpg") no-repeat top left;
}

#layout.cinema #footer .content {
  background: url("/images/footer-cinema.jpg") no-repeat top left;
}