/* styles LA CLEF */

* {margin: 0px;padding: 0px;}
body { margin: 0; padding: 0; }
html,body,div,span,applet,object,iframe,code,h1,h2,h3,h4,h5,h6,p,
blockquote,pre,a,abbr,acronym,address,big,cite,del,dfn,font,img,
ins,kbd,q,s,samp,small,strike,sub,sup,tt,var,dd,dl,dt,li,ol,ul,
fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,
th,td {margin:0; padding:0; border:0; text-align:left;}
table {border-collapse:collapse;border-spacing:0;}
ol,ul {list-style:none;}
q:before,q:after,blockquote:before,blockquote:after {content:"";}
html {margin:0;padding:0;}
* {outline:none}
a,a:hover {text-decoration:none; color: #e41e74;}
img {border:none}
span.decode,#filtersform .right_bottomfilter span.decode{background:none}
.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden}
.clearfix {display:inline-block}
* html .clearfix {height:1%}
.clearfix {display:block}
.clearall { clear: both;}
.clear, a.button span.clear{clear:both;height:0;width:0}
.hide {display:none}
.col {position:relative;float:left;}
.left {float:left}
.right {float:right}
.shade {
	-moz-box-shadow: 0px 1px 5px 0px #888888;
	-webkit-box-shadow: 0px 1px 5px 0px #888888;
	-o-box-shadow: 0px 1px 5px 0px #888888;
	box-shadow: 0px 1px 5px 0px #888888;
}



@font-face {
font-family: 'qlassic';
src: url('/front/tmg/framd.eot');
src: url('/front/tmg/framd.eot?iefix') format('eot'),
     url('/front/tmg/framd.woff') format('woff'),
     url('/front/tmg/framd.ttf') format('truetype'),
     url('/front/tmg/framd.svg#framd') format('svg');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'qlassicbold';
src: url('/front/tmg/framdm.eot');
src: url('/front/tmg/framdm.eot?iefix') format('eot'),
     url('/front/tmg/framdm.woff') format('woff'),
     url('/front/tmg/framdm.ttf') format('truetype'),
     url('/front/tmg/framdm.svg#framdm') format('svg');
font-weight: normal;
font-style: normal;
}



body {
	font-family: 'qlassic', verdana, arial, helvetica;
	background-image: url('/front/tmg/header-laclef.jpg');
	background-position: top center;
	background-repeat: no-repeat;
}
td {
	font-family: 'qlassic', verdana, arial helvetica;
}

/* partie centrale du site */
div#cle-main {
	margin: auto;
	width: 954px;
}


/* bandeau */
/* zone ou s'affiche le logo de la clef ainsi que le visuel représentant le batiment */

div#cle-bandeau {
	width: 954px;
	height: 316px;
}
div#cle-socialnet {
	float: left;
	width: 315px;
	/* eliminer les bordures par la suite */
}
div#cle-menuhead {
	float: right;
	width: 300px;
	/* eliminer les bordures par la suite */
	text-align: right;
}
div#cle-logolink {
	margin-top:150px; 
	width: 315px;
	height: 135px;
	cursor: pointer;
}

/* séparateur gris */

div#cle-separator-gray {
	height: 6px;
	width: 954px;
	background-color: #c0bebe;
	margin-bottom: 6px;
}

table#cle-mhead {
	width: 100%;
	height: 25px;
	margin-top:10px;
	margin-bottom: 7px;
}

/* header : menu */

.cle-tmenu {
	font-size: 12px;
	color: #999;
	font-family: "qlassic", verdana, helvetica;
}

.cle-tmenu a {
	text-decoration : none;
	color: #777;
}
.cle-tmenu a:hover {
	text-decoration : none;
	color: #e30054; /* rose */
}

/* header : cellule de buzz */
/* zone en haut à droite avec les icones cliquables de facebook et twitter */

.cle-buzz-cell {
	width:50px;
	text-align: center;
	overflow: hidden;
}
.cle-buzz-title {
	display: block;
	float: left;
	font-size: 11px;
	line-height: 11px;
	color: #e40153;
	width: 50px;
	height:14px;
}
.cle-buzz-img {
}





/* slider */

div#cle-slider {
	float: left;
	width: 643px;
	height: 243px;
}

/* body pour les pages */

div#cle-body {
	float: left;
	width: 502px;
	background-color: #fff;
	padding-bottom: 5px;
}

div#cle-body-ext {
	float: left;
	width: 825px;
	background-color: #fff;
	padding-bottom: 5px;
  	min-height: 100px;
}

/* pavé de souscription + teaser */
div#cle-subscribe {
	float: right;
	width: 290px;
}

div#cle-media {
	float: right;
	width: 290px;
}

div.cle-btn-ok {
	float:right;
	width: 19px;
	cursor: pointer;
}
div.cle-input-field {
	float:left;
	width: 260px;
}
div.cle-input-field input {
	width: 260px;
	border: 1px solid #444;
	font-size: 12px;
	margin-top: 1px;
	height: 16px;
	box-shadow: 1px 1px 7px #aaa; 
}

div#cle-subscribe-form-separator {
	height: 12px;
	clear: both;
}

div#cle-home-vid {
	width: 290px;
	height: 193px;
	/* border: 1px dotted #444; */
}


/* séparateur entre slider et promote */
div#cle-home-separator {
	clear: both;
	margin-bottom: 17px;
}

/* zone centrale */

/* pavé de promotion */

div#cle-promote {
	float: left;
	width: 502px;
	background-color: #fff;
	padding-bottom: 0px;
}

/* vertical menu */

div#cle-vmenu {
	float: left;
	width: 120px;
	margin-left: 18px;
}

div.cle-vmenu-item {
	width: 120px;
	height: 120px;
	/*border: 2px dotted #84c3ea;*/
	margin-bottom: 15px;
  clear: both;
}

div.cle-vmenu-item:hover {
	/*background-color: #f7f7f7;*/
	cursor: pointer;
}

div.cle-vmenu-item-sub {
	text-align:center;
	margin-top:5px;
}

div.cle-vmenu-item-sub a {
	color: #222;
	font-size: 14px;
	font-family: qlassicBold;
	text-decoration: none;
}

/* actualités en page d'accueil */

div#cle-promote-news {
	float: right;
	width: 290px;
	background-color: #fff;
}

div#cle-col-right {
	float: right;
	width: 290px;
}
div#cle-col-right-ext {
	float: right;
	width: 110px;
}
/* séparateur entre slider et promote, avec lien vers le haut de la page */
div#cle-backsup-elem {
	margin-bottom: 17px;
	padding-top: 20px;
	text-align: left;
	margin-top: 30px;
	width: 115px;
	float: right;
}

div#cle-backsup-elem ul {
	list-style-image:url('/front/tmg/up.gif');
	margin:0px;
	padding:0px;
	
}

a#cle-up-link {
	color: #e40557;
	font-size: 14px;
	text-decoration: underline;
}
a#cle-up-link:hover {
	color: #333;
}

/* séparation entre le lien vers le haut de la page et le footer */

div#cle-separator-footer {
	height: 36px;
	width: 954px;
	border-bottom: 1px solid #dad7d7;
}

/* footer:begin */

/* menu du footer */

/* menu footer:begin */
div#cle-footer-menu {
	float: left;
	width: 830px;
	height: 30px;
}

div#cle-footer-menu ul#cle-menu-down-items {
	color: #777;
	height: 12px;
	font-family: "qlassicBold", verdana, helvetica;
    list-style-type:none;
    margin: 10px auto;
	text-align: center;
}

div#cle-footer-menu ul#cle-menu-down-items li {
	display: inline;
	padding: 0 8px 0 5px;
	border-right: 1px solid #dad7d7;
}

div#cle-footer-menu ul#cle-menu-down-items li:last-child {
	border-right: none;
}

div#cle-footer-menu ul#cle-menu-down-items li a {
	color: #555;
	font-size: 12px;
	text-decoration: none;
}
div#cle-footer-menu ul#cle-menu-down-items li a:hover {
	color: #e30054;
	text-decoration: none;
}
/* menu footer:end */



div#cle-small-logo {
	float: right;
	width: 109px;
	height: 56px;
}
/* footer end */


/* fin de page:begin */
div#cle-separator {
	clear: both;
}

div#cle-marge-footer {
	height: 25px;
	width: 954px;
}
/* fin de page:end */






/* block promote  ------------------------------------------------------ */

div#cle-promote-inblock {
	margin: 0px;
}
.cle-promote-block-small {
	margin: 0px 12px 12px 0px;
	width: 152px;
	height: 200px;
	background-color: #ececec;
	float: left;
	overflow: hidden;
}

.cle-promote-block-medium {
	margin: 0px 12px 12px 0px;
	width: 237px;
	height: 200px;
	background-color: #ececec;
	float: left;
	overflow: hidden;
}

.cle-promote-block-large {
	margin: 0px 12px 12px 0px;
	width: 322px;
	height: 200px;
	background-color: #ececec;
	float: left;
	overflow: hidden;
}




.cle-promote-block-small, .cle-promote-block-medium, .cle-promote-block-large {
	cursor: default;
	-moz-user-select: none;
	-webkit-user-select: none;
}
.cle-blue {
	background-color: #9f9f9f;
}


.cle-promote-block-small span.cle-block-inside, .cle-promote-block-medium span.cle-block-inside, .cle-promote-block-large span.cle-block-inside {
	display: block;
	margin: 6px;
}


.cle-promote-section {
	color: #e30054;
	font-size: 11px;
}
.cle-promote-title {
	color: #000;
	font-size: 17px;
	font-family: verdana;
	font-weight: bold;
	line-height: 16px;
}
.cle-promote-desc {
	display: inline-block;
	margin-top: 5px;
	color: #777;
	font-size: 10px;
	font-family: verdana,arial,helvetica;
	line-height: 11px;
}

.cle-promote-title a {
	text-decoration: none;
	color: #000;
}
.cle-promote-title a:hover {
	text-decoration: underline;
	color: #444;
}

.cle-blue .cle-promote-section {
	color: #000;
  	display: block;
}
.cle-blue .cle-promote-title {
	color: #fff;
  	display: block;
}
.cle-blue .cle-promote-desc {
	color: #eee;
  	display: block;
}

.cle-promote-block-small:hover, .cle-promote-block-medium:hover, .cle-promote-block-large:hover {
	background-color: #e4e4e4;
}

.cle-blue:hover {
	background-color: #9b9b9b;
}

.cle-blue .cle-promote-title a {
	text-decoration: none;
	color: #fff;
}
.cle-blue .cle-promote-title a:hover {
	text-decoration: underline;
	color: #ddd;
}

/* block actualités  ------------------------------------------------------ */

.cle-title-block {
	height: 27px;
	color: #fff;
	background-color: #000;
}
.cle-title-block span {
	display: inline-block;
	margin: 5px;
	font-size: 15px;
	font-family: qlassicBold, arial, verdana, helvetica;
	margin-left: 12px;
	overflow: hidden;
}
.cle-news-block-panels {
	background-color: #fff;
	text-align: center;
	width:290px;
}

.cle-news-block-panels ul {
	 list-style-type:none;
	 margin: 0;
	 padding: 0;
}

.cle-news-block-panels li {
	float: left;
	padding: 3px;
	background-color: #dad7d7;
	text-align: center;
	margin-right: 2px;
	width: 89px;
	cursor: pointer;
}

.cle-news-block-panels li:hover {
	background-color: #ddd;
}

.cle-news-block-panels li:last-child {
	margin-right: 0px;
	width: 90px;
}

.cle-news-block-panels li.cle-selected {
	background-color: #fff;
	cursor: default;
}

/* liste d'actualites */

.cle-news-list-item {
	padding-left: 10px;
	padding-right: 0px;
	padding-bottom: 10px;
	border-bottom : 1px solid #ccc;
	margin-bottom: 10px;
	cursor: pointer;
}
.cle-news-list-item .cle-item-date {
	font-size: 11px;
	color: #888;
}
.cle-news-list-item .cle-item-rubrique {
	color: #e30054;
	font-size: 11px;
}
.cle-news-list-item .cle-item-title {
	color: #000;
	font-size: 16px;
}
.cle-news-list-item .cle-item-title a {
	text-decoration: none;
	color: #000;
}
.cle-news-list-item .cle-item-title a:hover {
	text-decoration: underline;
	color: #000;
}
.cle-news-list-item .cle-item-content {
	color: #777;
	font-size: 13px;
}

.cle-news-list-item:hover .cle-item-title a {
	text-decoration: underline;
	color: #222;
}



div.cle-news-block-footer {
	height: 27px;
	-moz-user-select: none;
	-webkit-user-select: none;
}

.cle-std-link {
	color: #e40557;
	font-size: 14px;
	text-decoration: underline;
}
.cle-std-link:hover {
	color: #333;
}

.cle-annonce-block {
	margin-top: 20px;
	border: 1px solid #3291cb;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	padding: 5px;
	cursor: pointer;
}
.cle-annonce-block:hover {
	border: 1px solid #c7c7c7;
}

.cle-annonce-block .cle-annonce-block-image {
	float: left;
	display: block;
	width: 100px;
	overflow-x: hidden;
}

.cle-annonce-block .cle-annonce-block-text {
	float: right;
	display: block;
	width: 160px;
	padding-top: 20px;
}
.cle-annonce-block .cle-annonce-block-text span {
	line-height: 16px;
	text-transform: uppercase;
}
span.annonce-block-text-sub {
	line-height: 14px;
	font-size: 14px;
	text-transform: uppercase;
	color: #777;
}


/* menu:begin */
table#cle-menu {
	width: 954px;
	height: 20px;
}
table#cle-menu td {
	background-color: #000;
	color: #fff;
	height: 20px;
	border-right: 2px solid #fff;
	white-space: nowrap;
	cursor: pointer;
}
table#cle-menu td:last-child {
	border-right: 2px solid #000;
}

table#cle-menu td.cle-menu-selected {
	background-color: #c0bebe;
	color: #000;
	cursor: default;
}

table#cle-menu td a {
	display: block;
	padding: 1px 10px 1px 10px;
	font-size: 17px;
  color: #fff;
	font-family: 'qlassicbold', verdana, arial, helvetica;
}

table#cle-menu td.cle-menu-selected a {
  color: #111;
}
a.cle-menu-item {
	font-family: 'qlassicbold', verdana, arial, helvetica;
}

.cle-menu-sub {
	width: 954px;
	height: 35px;
	margin-bottom: 15px;
}

.cle-menu-sub ul {
	font-family: qlassic, arial, verdana, helvetica;
	font-size: 15px;
    	list-style-type:none;
   	 margin: 0px;
	padding-left: 3px;
	padding-top: 5px;
}
.cle-menu-sub li {
	float: left;
	padding-right: 7px;
	padding-left: 7px;
	padding-bottom:3px;
	font-size: 14px;
	border-right: 1px solid #ccc;
}
.cle-menu-sub li:last-child {
	border: none;
}
.cle-menu-sub li a {
	color: #222;
	text-decoration: none;
}
.cle-menu-sub li a:hover {
	color: #777;
	text-decoration: underline;
}
.cle-menu-sub li.select a {
	color: #e30054;
}
.cle-menu-sub li.select a:hover {
	color: #e30054;
}

.cle-menu-selected a {
	color: #000;
}

div#cle-menu-footer {
	width: 954px;
	height: 40px;
}

/* articles */
.block-article-title {
	background-image: url('/front/tmg/pres-rouge.jpg');
	background-repeat: no-repeat;
	width: 481px;
	height: 57px;
	display: block;
}


/* agenda */
#laclef-tbl-agenda {
	width: 484px;
}
#laclef-tbl-agenda td {
	width:161px;
  	background-color: #dad7d7; padding: 2px 4px;
  	border: 3px solid #fff;
	cursor: pointer;
  	text-align: center;
	-moz-user-select: none;
	-webkit-user-select: none;
}

#laclef-tbl-agenda td.select-agenda-pad {
	background-color: #fff;
	cursor: pointer;
}

.cle-agenda-panel {
	background-color: #fff;
	text-align: center;
	width:350px;
}

.cle-agenda-panel ul {
	 list-style-type:none;
	 margin: 0;
	 padding: 0;
}

.cle-agenda-panel li {
	float: left;
	padding: 3px;
	background-color: #dad7d7;
	text-align: center;
	margin-right: 2px;
	width: 89px;
	cursor: pointer;
}

.div-inscriptions-title {
	margin: 15px 0px 2px 0px; 
	font-family: QlassicBold; 
	font-size: 18px;
}
.div-inscriptions-title a {
	color: #333;
	text-decoration: underline;
}
.div-inscriptions-title a:hover {
	color: #333;
	text-decoration: none;
}

/* flink */

a.flink {
	display: block;
    margin: 2px 0px 5px 20px;
}
a.flink:hover {
	text-decoration: underline;
  	color: #444;
}
