/* CSS Document */

/* Contenus accueil */
#img-accueil { height: calc(100vh - 80px); background-position: center; background-repeat: no-repeat; background-size: cover; transition: all .1s ease-in-out; }
#img-accueil > div { position: absolute; left: 50%; width: 90%; top: 24px; transform: translate(-50%, 0); text-align: center; padding: 0; z-index: 2; color: #fff;
    font-size: 16px; font-weight: 700; text-shadow: 0 0 2px #000, -1px -1px 2px #000, 1px 1px 2px #000; }
#img-accueil > div h1 { color: #000; font-size: 32px; line-height: 32px; font-weight: 700; margin-bottom: 6px;
    text-shadow: 1px 1px 1px #eee, -1px -1px 1px #eee, -1px 1px 1px #eee, 1px -1px 1px #eee, 0 0 4px rgba(0,0,0,0.3); }
#img-accueil > div img { height: 80px; border-radius: 50%; box-shadow: 0 0 4px rgba(0,0,0,0.3); }
#txt-accueil { min-height: calc(100vh - 152px); }
#txt-accueil > .eltmsg { padding: 0; }

/* Structure d'affichage des pages de contenus */
#cnt-content { position: relative; padding: 32px 0 0 0; margin: 0 20px; min-height: calc(100% - 252px); box-sizing: border-box; } 
body.home #cnt-content { min-height: calc(100% - 112px); } 
#cnt-content img, #cnt-content iframe { max-width: 100%; box-sizing: border-box; }
#cnt-content #inf-bandeau { height: 64px; line-height: 64px; text-align: center; background-repeat: no-repeat; background-position: center; background-size: cover; 
	padding: 0 12px; box-sizing: border-box; }
#cnt-content #inf-bandeau > div { display: inline-block; font-weight: 700; line-height: 1.1em; vertical-align: middle; color: #fff; 
	text-shadow: 0 0 2px #000, -1px -1px 2px #000, 1px 1px 2px #000; }
#cnt-content #inf-bandeau > div > h1 { color: #000; font-size: 32px; line-height: 36px; margin: 0 0 6px 0;
	text-shadow: 1px 1px 1px #eee, -1px -1px 1px #eee, -1px 1px 1px #fff, 1px -1px 1px #fff; }
#cnt-content #inf-bandeau > div > h1.blanc { color: #fff; text-shadow: 0 0 1px #000, 0 0 2px #000, 0 0 4px #000; }
#cnt-content #inf-bandeau.inf-membre { }
#cnt-content #inf-bandeau.ent-membre { position: relative; border-radius: 50px 0 0 50px; margin: 0 0 24px 0; }
#cnt-content #inf-bandeau.ent-membre > div#img-avatar { position: absolute; display: block; left: 6px; top: 4px; height: 76px; width: 76px; border: 8px solid #fff; border-radius: 50%; 
	background-position: center; background-repeat: no-repeat; background-size: cover; background-color: #fff; }
#cnt-content #inf-bandeau.ent-membre > div#cnt-infusr { display: block; text-align: left; padding: 18px 0 0 120px; }
#cnt-content #inf-bandeau.ent-membre > div#cnt-infusr > h1 { text-align: left; }

/* Menu fixé en haut lorsqu'on scroll */
body.scrolled #menu { position: fixed; top: 0; left: 0; right: 0; z-index: 10; }
body.scrolled #cnt-content { padding: 64px 0 0 0; }

/* Publication/modification d'un message */
#cnt-newmsg { text-align: center; margin: 16px 0 48px 0; }
#btn-newmsg { display: inline-block; font-size: 18px; line-height: 24px; font-weight: 700; padding: 6px 12px 6px 32px; box-shadow: 0 0 1px rgba(0,0,0,0.3);
    background: rgba(255,255,255,0.5) url(/img/front/btn-ajouter.png) no-repeat center left 10px; }
#fad-addmsg { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.6) url(/img/front/bg-fader.png) no-repeat center; background-size: cover; z-index: 1001;
	-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; display: none; opacity: 0; }
#cnt-addmsg {position: fixed; top: 50%; left: 50%; width: 800px; overflow: auto; padding: 0; margin: 0 auto; z-index: 1002; max-width: 96%;
	-webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
#fad-contrib { position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.6) url(/img/front/bg-fader.png) no-repeat center; background-size: cover; z-index: 1001;
	-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; 
	opacity: 0; }
#cnt-modmsg { position: fixed; top: 50%; left: 50%; width: 800px; overflow: auto; padding: 0; margin: 0 auto; z-index: 1002; opacity: 0; max-width: 96%;
	-webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
#cnt-formmod { margin-bottom: 0; box-sizing: border-box; padding-bottom: 27px; }
#cnt-formmod > h2 { margin: 0; }
#cnt-formmod > form { box-sizing: border-box; max-height: 85vh; overflow: auto; }
#chx-optsmod { position: fixed; left: 1px; right: 1px; bottom: 1px; }
.cnt-form.cnt-contrib { width: 800px; box-shadow: 0 0 1px rgba(0,0,0,0.3); padding: 0; margin: 0 auto 40px auto; z-index: 9; }
.cnt-form.cnt-contrib .fermer { position: absolute; top: 10px; right: 12px; color: #666; height: 16px; width: 16px; opacity: 0.5; transition: all .3s ease-in-out; }
.cnt-form.cnt-contrib .fermer:hover { opacity: 1; }
.cnt-form.cnt-contrib > h2 { margin: 0; }
.cnt-form.cnt-contrib > form { }
form.frm-contrib { position: relative; background: #fff; padding: 0; margin: 0; width: 800px;  max-width: 100%; }
.chx-opts { font-size: 12px; text-align: left; border-top: 1px dotted #999; background: #f0f0f0; }
.chx-opts .chxopt { display: inline-block; float: right; height: 16px; line-height: 16px; padding: 6px 12px 6px 12px; border-left: 1px dotted #999; 
	vertical-align: middle; transition: all 0.3s ease-in-out; color: #333; background: #f0f0f0; }
.chx-opts .chxopt > img { display: inline-block; margin: -2px 4px 0 0; vertical-align: middle; }
.chx-opts .chxopt:hover, .chx-opts .chxopt.actif { background: rgba(0,0,0,0.7); color: #fff; cursor: pointer; }
.chx-opts .chxopt:hover > img, .chx-opts .chxopt.actif > img { -webkit-filter: contrast(0) brightness(100); -ms-filter: contrast(0) brightness(100); filter: contrast(0) brightness(100); }

.frm-contrib .txtmsg { width: 100%; display: inline-block; height: 140px; line-height: 20px; border: none; padding: 4px 6px 4px 6px; margin: 0; background: #fff; color: #333; 
	-webkit-touch-callout: auto; -webkit-user-select: auto; -khtml-user-select: auto; -moz-user-select: auto; -ms-user-select: auto; user-select: auto; 
	overflow: auto; transition: all 0.3s ease-in-out; box-sizing: border-box; vertical-align: top; }
.frm-contrib .txtmsg:focus { outline: none; }
.valmsg { float: right; color: #fff !important; background: #333 !important; font-weight: 700; right: 0; bottom: 0; height: 28px; line-height: 20px; width: 40px; border: none !important; 
	box-sizing: border-box; vertical-align: top; }
.cnt-panels { position: relative; transition: all 0.3s ease-in-out; }
.cnt-panels > div { height: 0; opacity: 0; transition: all 0.3s ease-in-out; box-sizing: border-box; overflow: hidden; }
.cnt-panels > div.actif { height: auto; opacity: 1; }
.cnt-panels > div > input { display: block; border: none; border-top: 1px dotted #aaa; background: #ebc796; width: 100%; box-sizing: border-box; }
.cnt-panels > div > .pan-entete { background: #e4e4e4; color: #444; font-size: 9px; line-height: 12px; font-style: italic; font-weight: 400; padding: 2px 8px; }
.cnt-panels > div > .pan-content { padding: 4px 6px; }
.cnt-panels > div > .pan-content > .apelnk { margin: 0; }
.cnt-panels > div > .pan-content .pan-label { display: inline-block; font-size: 12px; font-style: italic; margin-right: 8px; }
.cnt-panels > div.pan-options .inline:nth-child(n+2) { margin-left: 20px;}
.cnt-panels > div.pan-options select, .cnt-panels > div.pan-options input { font-size: 12px; padding: 2px 4px; line-height: 14px; vertical-align: middle; }
.cnt-panels > div.pan-options input.date { width: 74px; }
.cnt-panels > div.pan-smiley { border-top: 1px dotted #999; }
.cnt-panels > div.pan-smiley .pan-content { max-height: 128px; overflow: auto; text-align: center; }
.cnt-panels > div.pan-smiley > .pan-content > img { display: inline-block; padding: 3px; cursor: pointer; transition: all 0.3s ease-in-out; box-sizing: content-box !important; margin: 1px 0; }
.cnt-panels > div.pan-smiley > .pan-content > img:hover { background: #fff; box-shadow: 4px 4px 8px rgba(0,0,0,0.8), 0 0 1px rgba(0,0,0,0.5) inset; z-index: 1001;
	-webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); }
/* .cnt-panels > div.pan-photo .btn-photo { display: inline-block; background: url(/img/front/btn-add.png) no-repeat left center; padding: 2px 8px 2px 18px; 
	transition: all 0.3s ease-in-out; font-size: 13px; line-height: 15px; cursor: pointer; }
.cnt-panels > div.pan-photo .btn-photo:hover { text-decoration: underline; } */
[contentEditable=true]:empty:not(:focus):before, [contentEditable=true].vide:not(:focus):before { content: attr(placeholder); color: grey; font-style: italic; }
.cnt-panels > div.pan-event input.date { display: inline-block !important; float: left; width: 100px; background: #f4f4f4 url(/img/front/btn-date.png) no-repeat 4px 3px;
	box-sizing: border-box; font-size: 13px; border-right: 1px dotted #ccc; padding: 4px 6px 4px 24px; }
.cnt-panels > div.pan-event .datevt[id] { display: none !important; } /* Masquer la zone d'origine du champ date qui est cloné */
.cnt-panels > div.pan-event .libevt { display: inline-block; float: left; width: calc(100% - 100px); box-sizing: border-box; }

/* Aperçus liens */
.url-load { overflow: hidden; text-overflow: ellipsis; hyphens: auto; word-wrap: break-word; position: relative; margin: 16px 32px; }
.apelnk { position: relative; display: table; width: 100%; max-width: 100%; padding: 12px 12px; border-radius: 8px;
	box-sizing: border-box; transition: all .3s ease-in-out; }
.apelnk > img { max-width: 100%; max-height: 480px; }
.apelnk > .imgurl { display: table-cell; width: 300px; height: 160px; background-position: center; background-size: cover; background-repeat: no-repeat; vertical-align: top; }
.apelnk > .imgurl > .yt_overlay { width: 100%; height: 100%; background: url(/img/front/youtube-overlay.png) no-repeat center; background-size: auto; }
.apelnk > .txturl { display: table-cell; max-height: 160px; transition: all .3s ease-in-out; vertical-align: middle; padding: 0 24px; }
.apelnk > .txturl > .titurl { font-family: 'Barlow Condensed', sans-serif; font-weight: 300; font-size: 24px; line-height: 26px; color: #666; margin-bottom: 12px; max-height: 52px; overflow: hidden; }
.apelnk > .txturl > .desurl { color: #999; font-size: 14px; line-height: 18px; max-height: 90px; overflow: hidden; }
.apelnk:hover { opacity: 0.5; }
.apelnk.nodesc { font-family: 'Barlow Condensed', sans-serif; font-weight: 300; font-size: 24px; line-height: 26px; color: #666; height: auto; overflow: hidden; text-align: center; display: block; }
.apelnk > iframe { width: 800px !important; height: 450px !important; }

/* Albums photos */
#lst-albums { display: none; opacity: 0; position: absolute; box-shadow: 0 0 4px rgba(0,0,0,0.3); z-index: 1002; background: #fff; }
#lst-albums > a { display: block; color: #333; background: #fff; padding: 3px 6px; transition: all 0.3s ease-in-out; font-size: 12px; }
#lst-albums > a:hover { color: #fff; background: #333; }
.cnt-album { position: relative; height: auto; color: #333; background: transparent; text-align: center; }
.cnt-album > div { position: relative; display: inline-block; width: 300px; height: 300px; vertical-align: top; margin: 3px 4px;
    background-position: center; background-repeat: no-repeat; background-size: cover; transition: all .3s ease-in-out; }
.cnt-album > div:hover { -webkit-filter: brightness(80%); -ms-filter: brightness(80%); filter: brightness(80%); }

/* Discussions */
#cnt-posts { max-width: 1280px; margin: auto; }
#ploading { text-align: center; }
#ploading > span { display: inline-block; line-height: 24px; margin: 5px 0; padding: 0 0 0 28px; font-weight: 400; font-size: 24px; 
	letter-spacing: 2px; color: #b3b3b3; background: url(/img/front/mini-loader.gif) no-repeat left center; }
#cnt-photos > #ploading { margin-top: 20px; }
.eltmsg { box-shadow: 0 0 1px rgba(0,0,0,0.3); box-sizing: border-box; margin: 0 0 48px 0; background: rgba(255,255,255,0.5); padding: 33px 0 0 0; }
.eltmsg .mancre { position: absolute; top: 0; left: 0; }
.eltmsg .infmsg { position: absolute; top: 0; left: 0; right: 0; height: 16px; font-size: 13px; line-height: 16px; color: #555; padding: 8px 24px;  border-bottom: 1px dotted #aaa; }
.eltmsg .infmsg > a { display: inline-block; margin: 0 2px; font-weight: 700; }
.eltmsg .infmsg .msg-menu { position: absolute; right: 16px; top: 7px; }
.eltmsg .infmsg.bgd-coul .msg-menu { -webkit-filter: contrast(0) brightness(100); -ms-filter: contrast(0) brightness(100); filter: contrast(0) brightness(100); }
.eltmsg .infmsg .msg-menu img { margin: 0 0 0 4px; }
.eltmsg .txtmsg { font-size: 24px; line-height: 32px; font-weight: 300; padding: 16px 24px; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; transition: all 0.3s ease-in-out; }
.eltmsg .txtmsg img { max-height: 19px; }
.eltmsg .txtmsg h2 { font-family: 'Barlow Condensed', sans-serif; font-size: 32px; line-height: 32px; font-weight: 600; margin: 0 0 12px 0; text-transform: uppercase; }
.eltmsg .txtmsg .datevt { display: block; color: #800; font-weight: 700; font-size: 15px; line-height: 18px; padding: 6px 12px 6px 40px; margin: 0 0 12px 0; vertical-align: top; }
.eltmsg .txtmsg .datevt .datico { position: absolute; left: 0; width: 32px; top: 0; bottom: 0; background: #800 url(/img/front/picto-date.png) no-repeat center; }
.eltmsg.ftxt.flnk .txtmsg, .eltmsg.ftxt.fimg .txtmsg { border-bottom: 1px dotted #aaa; }
.eltmsg.ftxt.fimg.img1.fevt .txtmsg { border-bottom: 0; }
.eltmsg .imgmsg { margin: 16px 24px 24px 24px; padding: 0px; }
.eltmsg .endmsg { clear: both; font-size: 0; height: 0; overflow: hidden; }
.eltmsg .image { height: 300px; text-align: center; padding: 16px; margin: 16px 0; background-position: center; background-repeat: no-repeat; background-size: contain; }
.eltmsg iframe { width: 100%; }
.eltmsg.img1.fevt { padding: 33px 348px 0 0; min-height: 365px; }
.eltmsg.img1.fevt .imgmsg { position: absolute; width: 300px; top: 49px; right: 24px; margin: 0; }
.eltmsg.img1.fevt .imgmsg .cnt-album.cnt-1img > div { background-position: center right; background-size: contain; margin: 0; }

/* Photos */
#cnt-photos { text-align: center; }
.cntimg { position: relative; display: inline-block; width: 300px; height: 300px; margin: 3px 4px; vertical-align: top; overflow: hidden; }
.cntimg > .bgimg { position: absolute; left: 0; right: 0; top: 0; bottom: 0; background-position: center; background-size: cover; background-repeat: no-repeat; transition: all 0.3s ease-in-out; }
.cntimg > .bgimg.bgbuf { background-image: url(/img/front/ajax-loader.gif); background-size: auto; background-color: #fff; }
.cntimg > .hover { position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0,0,0,0.5); color: #fff; opacity: 0; transition: all 0.3s ease-in-out; }
.cntimg > .hover .date { font-size: 11px; padding: 4px 8px; }
.cntimg > .hover .titre { font-size: 14px; font-weight: 700; }
.cntimg > .hover .bas { position: absolute; bottom: 0; left: 0; right: 0; max-height: 150px; padding: 4px 8px; font-size: 11px; }
.cntimg:hover > .bgimg { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); }
.cntimg:hover > .hover { opacity: 1; }
.cntimg > .titimg { position: absolute; left: 0; right: 0; padding: 0 8px; top: 50%; max-height: 80%; color: #fff; font-size: 18px; font-weight: 700;
	text-shadow: 0 0 12px #000, 0 0 2px #000, -1px -1px 2px #000, -1px 1px 2px #000, 1px -1px 2px #000, 1px 1px 2px #000; overflow-wrap: break-word;
	-webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }

/* Liste des admins / abonnés */
#cnt-admins { border-top: 1px dotted #aaa; }
.cnt-user { padding: 4px 6px; border-bottom: 1px dotted #aaa; }
.cnt-user > strong > img { display: inline-block; height: 12px; width: 12px; vertical-align: top; margin: 4px 0 0 0; }
.cnt-user .cnt-drts { float: right; margin: 0 0 0 6px; vertical-align: top; border: none; width: 96px; background: #f4f4f4; box-sizing: border-box; font-size: 10px; }
#cnt-abonnes { border-top: 1px dotted #aaa; }
#cnt-abonnes > a { display: block; margin: 8px 0 0 0; }
#cnt-abonnes > a > em { display: inline-block; color: #333; font-size: 11px; width: 60px; }

/* Page contact */
#txt-contact > .eltmsg { padding: 0; }
#txt-contact > .eltmsg > .txtmsg { text-align: left; }
#txt-contact h3 { font-size: 20px; font-weight: 600; letter-spacing: 0; margin: 5px 0 10px 0; text-transform: uppercase; }
#img-contact { float: right; margin: 0 0 12px 24px; max-height: 480px; max-width: 50% !important; }
#con-abonn { display: block; overflow: auto; font-size: 13px; line-height: 16px; }
#con-abonn #btn-abonn { display: inline-block; padding: 6px 12px 6px 44px; color: #fff; font-size: 16px; line-height: 20px; height: 32px; margin: 4px 0 8px 0; box-sizing: border-box; 
    box-shadow: 0 0 8px rgba(255,255,255,0.3) inset; background-image: url(/img/front/btn-thumbup.png); background-position: center left 12px; background-repeat: no-repeat; }
#con-abonn #btn-abonn.desabo { background-image: url(/img/front/btn-thumbdn.png); }
#con-coord { display: block; padding: 0 0 12px 0; margin: 0 0 12px 0; border-bottom: 1px dotted #999; overflow: auto; }
#con-coord #conmel { display: inline-block; font-size: 18px; line-height: 24px; margin: 0 0 6px 0; }
#con-coord #contel { display: inline-block; font-size: 24px; line-height: 24px; margin: 0 0 6px 0; font-weight: 700; }
#con-coord .rsoc { display: inline-block; margin: 0 3px 6px 3px; width: 40px; height: 40px; border-radius: 50%; transition: all .2s ease-in-out;
    background-color: #333; background-repeat: no-repeat; background-position: center; }
#con-coord .rsoc:hover { transform: translateY(-4px) rotateZ(6deg); box-shadow: 2px 2px 4px rgba(0,0,0,0.5); }
#con-coord #rs_fb { background-image: url(/img/front/rsoc_fb.png); }
#con-coord #rs_in { background-image: url(/img/front/rsoc_in.png); }
#con-coord #rs_tt { background-image: url(/img/front/rsoc_tt.png); }
#con-coord #rs_yt { background-image: url(/img/front/rsoc_yt.png); }
#con-coord #rs_sc { background-image: url(/img/front/rsoc_sc.png); }
#con-coord #rs_bc { background-image: url(/img/front/rsoc_bc.png); }

/* Avertissement page non publiée */
#alertNP { position: fixed; bottom: 20px; right: 0; padding: 8px 12px; background: #800; color: #fff; font-size: 14px; font-weight: 700; border-radius: 20px 0 0 20px; z-index: 9999;
    box-shadow: 3px -3px 8px rgba(255,237,220,0.3) inset, 0 0 4px rgba(0,0,0,0.7); text-align: center; transition: all .3s ease-in-out; }
#alertNP:hover { padding-right: 24px; }
#alertNP > span { display: block; font-size: 11px; font-weight: 300; }

/* Boutons de partage */
#btn-share { height: 32px; margin: 32px 0; }
.st-btn { box-shadow: 0 0 6px rgba(0,0,0,0.3); }

/* ------------------------------------------------ */
/* Format PC/tablettes < 1400px						*/
@media handheld, only screen and (max-width: 1400px), only screen and (max-device-width: 1400px) {

}

/* ------------------------------------------------ */
/* Format PC/tablettes < 1200px						*/
@media handheld, only screen and (max-width: 1200px), only screen and (max-device-width: 1200px) {
	
    #img-accueil > div h1 { font-size: 30px; line-height: 30px; }
    
    .eltmsg .txtmsg { font-size: 20px; line-height: 28px; }
    .eltmsg .txtmsg h2 { font-size: 28px; line-height: 28px; }	

    #fenmsg.eltmsg { width: 720px; }
    
    .cntimg { width: 240px; height: 240px; }
}

/* ------------------------------------------------ */
/* Format < 900px									*/
@media handheld, only screen and (max-width: 900px), only screen and (max-device-width: 900px) {

    #cnt-content { padding: 24px 0 0 0; }

    #img-accueil > div h1 { font-size: 28px; line-height: 28px; }
    #img-accueil > div { font-size: 15px; }
        
    .cntimg { width: 200px; height: 200px; }
    
    .eltmsg { margin: 0 0 32px 0; }
    .eltmsg .infmsg { padding: 8px 16px; }
    .eltmsg .txtmsg { padding: 16px; font-size: 18px; line-height: 24px; }
    .eltmsg .txtmsg h2 { font-size: 26px; line-height: 26px; }
    .eltmsg .txtmsg .datevt { font-size: 14px; }
    .eltmsg.img1.fevt .imgmsg { right: 16px; }
}

/* ------------------------------------------------ */
/* Format mobiles < 660px							*/
@media handheld, only screen and (max-width: 660px), only screen and (max-device-width: 660px) {
	
    h2.souligne { margin: 0 0 12px 0; }

    #cnt-content { margin: 0 10px; padding: 16px 0 0 0; }

    #img-accueil > div h1 { font-size: 24px; line-height: 24px; }
    #img-accueil > div { font-size: 14px; }

	.chx-opts .chxopt { font-size: 0; padding: 6px 5px 4px 8px; }
		
	.eltmsg .infmsg { font-size: 11px; }
	.eltmsg .infmsg .msg-menu { right: 12px; }
	.eltmsg iframe { max-height: 260px; }
	.eltmsg .image { height: 200px; }
	.eltmsg .txtmsg { padding: 8px 12px; font-size: 16px; line-height: 22px; }
    .eltmsg .txtmsg h2 { font-size: 24px; line-height: 24px; }
    .eltmsg .txtmsg .datevt { font-size: 13px; }
	.eltmsg .imgmsg { margin: 12px 12px; }
	.eltmsg.img1.fevt .imgmsg { width: 200px; height: 200px; right: 12px; }
    .eltmsg.img1.fevt { padding: 33px 248px 0 0; min-height: 265px; }

	.url-load { margin: 12px 12px; }
	.apelnk > .imgurl { width: 200px; height: 120px; }
	.apelnk > .txturl { max-height: 120px; overflow: hidden; }
	.apelnk > .txturl > .desurl { font-size: 13px; line-height: 16px; max-height: 80px; }
	.apelnk.nodesc { font-size: 20px; line-height: 24px; }
	
    .cnt-album > div { width: 200px; height: 200px; }
    
    #cnt-newmsg { margin: 16px 0 32px 0; }
    
    #txt-contact > .eltmsg > .txtmsg { text-align: left; }
    #img-contact { float: none; display: block; margin: 0 0 12px 0; width: 100%; max-width: 100% !important; }
	
	#cnt-menusr .btn-menusr { font-size: 14px; }
	#frm-user { margin: 0; width: auto; padding: 12px 16px; }
	#lst-menusr .btn-menusr { font-size: 16px; }
}

/* ------------------------------------------------ */
/* Format mobiles < 480px							*/
@media handheld, only screen and (max-width: 480px), only screen and (max-device-width: 480px) {

	#cnt-content { margin: 0 6px; }

    #img-accueil > div h1 { font-size: 20px; line-height: 20px; }
    #img-accueil > div { font-size: 13px; }
    
    .cnt-popmen { max-width: 300px; }
		
    .eltmsg { margin: 0 0 24px 0; }
	.eltmsg iframe { max-height: 220px; }
	.eltmsg .image { height: 150px; background-size: cover; }
    .eltmsg .txtmsg { padding: 6px 8px; font-size: 15px; line-height: 20px; }
    .eltmsg .txtmsg h2 { font-size: 20px; line-height: 20px; } 
    .cnt-album > div { width: 46%; height: 40vw; }
    .eltmsg.img1.fevt { padding: 33px 0 0 0; }
    .eltmsg.img1.fevt .imgmsg { position: relative; top: auto; right: auto; margin: 12px; height: auto; width: auto; }
    .eltmsg.img1.fevt .imgmsg .cnt-album.cnt-1img > div { background-position: center; width: 200px; height: 200px; }
    
	.apelnk { display: block; padding: 0; }
	.apelnk > .imgurl { display: block; width: auto; margin: 0 0 12px 0; height: 180px; }
	.apelnk > img { max-height: 320px; }
	.apelnk > .txturl { display: block; max-height: none; padding: 0; }
	.apelnk > .txturl > .desurl { font-size: 12px; line-height: 15px; max-height: 75px; }

	
	.cntimg { width: 45%; height: 45vw; }
	
	#cnt-menusr .btn-menusr { font-size: 13px; }
	
    #con-abonn #btn-abonn { font-size: 14px; }
    #con-coord #conmel { font-size: 15px; }
    #con-coord #contel { font-size: 20px; line-height: 20px; }
    #con-coord .rsoc { width: 32px; height: 32px; background-size: 24px; }
    
    #pied { font-size: 12px; }
}

/* ------------------------------------------------ */
/* Format mobiles < 320px							*/
@media handheld, only screen and (max-width: 320px), only screen and (max-device-width: 320px) {

	.eltmsg iframe { max-height: 180px; }
}