@import url(../../styles/fck_ic.css.php);



/* ############################################################################ */
/* ################################### INDEX.PHP ############################## */


/* TEXTE */
#blocktxtic {
  overflow:hidden;
	display: block;
	text-align: left;
}
#blocktxtic, #photos_ic2 { margin: 0px 0px; }


#blocktxtic ul { list-style-type:circle; padding-left:20px; }
#blocktxtic ul li { list-style-type:disc;  }
#blocktxtic ol li { list-style-type:decimalcircle;  }


#blocktxtic p { padding:0; margin: 0 0 0px; font-family: verdana; font-size: 14px; line-height: 21px; }
#blocktxtic, #blocktxtic td, #blocktxtic tr { font-size:12px !important; color:#333 !important; line-height:1.7em; }



/* PHOTOS */
#photos_ic img, #photos_ic2 img, #photos_ic .alt, #photos_ic2 .alt {
  border:3px solid none;
}

#photos_ic {
	position: relative;
	float: right;
	margin-bottom: 6px;
	margin-left: 10px;
	text-align: center;
}
#photos_ic .imgIC, #photos_ic2 .imgIC { display:block; position:relative; }
#photos_ic img, #photos_ic2 img { margin-bottom: 0; }
#photos_ic .alt, #photos_ic2 .alt {
 background: #0D2240 none repeat scroll 0 0;
    color: #FFF;
    font-family: "Hammersmith One",sans-serif;
    font-size: 15px;
    padding: 0px;
    text-align: center;
    text-transform: uppercase;
}
#photos_ic .alt span, #photos_ic2 .alt span {
  display: block;
  color: #fff;
  padding: 15px;
	text-align:left;
}
#photos_ic .alt span.nopadd, #photos_ic2 .alt span.nopadd{
	padding-right:4px;
}
#photos_ic .alt a, #photos_ic2 .alt a {
  position:relative;
}
#photos_ic .alt a:hover, #photos_ic2 .alt a:hover { text-decoration:none; }
#photos_ic .alt img, #photos_ic2 .alt img {
  display: block;
	float:right;
  border: 0;
	margin:4px 3px 0 0;
}



/* PHOTOS 2 */
#photos_ic2 {
	position: relative;
	margin-top: 5px;
	text-align: center;
	_height:10px;
}
#photos_ic2 img { margin: 0; }
#photos_ic2 .photoIC {
  position: relative;
  float: left;
}






#navIC { padding:5px 0; }
#listArts { position:relative;width:950px;height:175px;margin:10px auto 0;padding:0;background:none;border-radius:0;text-align:left; }
#listArts2 { position:relative;left:55px;width:840px;height:175px;overflow:hidden }
#listArts3 { position:relative;top:15px;width:10000px }
#listArts .blockArt { position:relative;display:block;text-decoration:none;width:210px;height:145px;float:left; }
#listArts .link { float:left; position:relative;display:block;margin:0 auto;text-decoration:none;background:#fff;width:200px;height:145px;margin-right:10px; }
#listArts .link:hover { background:#ccc; }
#listArts .blockArtSelect .link { background:#ccc; }
#listArts .photo { position:relative;top:4px;left:10px;display:block;width:175px;height:98px;overflow:hidden; background:#fff; border:3px solid #fff; outline:1px solid #d0d0d0; }
#listArts a.link .titre { color:#555555;display:block;margin:10px 15px 0 }
#listArts a.select .titre, #listArts a:hover .titre { color:#e04552; }
#artLeft { position:absolute; top:72px; left:15px; cursor:pointer; }
#artRight { position:absolute; top:72px; right:15px; cursor:pointer; }

.css3 #listArts .link { -webkit-transition: all 300ms ease-in-out 0s; -moz-transition: all 300ms ease-in-out 0s; -o-transition: all 300ms ease-in-out 0s; -ms-transition: all 300ms ease-in-out 0s; transition: all 300ms ease-in-out 0s; }
.css3 #listArts .link:hover { -webkit-animation: rotate-anim 1s ease-in-out 1; -moz-animation: rotate-anim 1s ease-in-out 1; -ms-animation: rotate-anim 1s ease-in-out 1; -o-animation: rotate-anim 1s ease-in-out 1; animation: rotate-anim 1s ease-in-out 1; }
@-webkit-keyframes rotate-anim { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); } 20% { transform: rotate(-4deg); -webkit-transform: rotate(-4deg); -moz-transform: rotate(-4deg); -o-transform: rotate(-4deg); } 40% { transform: rotate(4deg); -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg); -o-transform: rotate(4deg); } 60% { transform: rotate(-4deg); -webkit-transform: rotate(-4deg); -moz-transform: rotate(-4deg); -o-transform: rotate(-4deg); } 80% { transform: rotate(4deg); -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg); -o-transform: rotate(4deg); } to { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); }  } @-moz-keyframes rotate-anim { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); } 20% { transform: rotate(-4deg); -webkit-transform: rotate(-4deg); -moz-transform: rotate(-4deg); -o-transform: rotate(-4deg); } 40% { transform: rotate(4deg); -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg); -o-transform: rotate(4deg); } 60% { transform: rotate(-4deg); -webkit-transform: rotate(-4deg); -moz-transform: rotate(-4deg); -o-transform: rotate(-4deg); } 80% { transform: rotate(4deg); -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg); -o-transform: rotate(4deg); } to { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); }  } @-o-keyframes rotate-anim { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); } 20% { transform: rotate(-4deg); -webkit-transform: rotate(-4deg); -moz-transform: rotate(-4deg); -o-transform: rotate(-4deg); } 40% { transform: rotate(4deg); -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg); -o-transform: rotate(4deg); } 60% { transform: rotate(-4deg); -webkit-transform: rotate(-4deg); -moz-transform: rotate(-4deg); -o-transform: rotate(-4deg); } 80% { transform: rotate(4deg); -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg); -o-transform: rotate(4deg); } to { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); }  } @keyframes rotate-anim { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); } 20% { transform: rotate(-4deg); -webkit-transform: rotate(-4deg); -moz-transform: rotate(-4deg); -o-transform: rotate(-4deg); } 40% { transform: rotate(4deg); -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg); -o-transform: rotate(4deg); } 60% { transform: rotate(-4deg); -webkit-transform: rotate(-4deg); -moz-transform: rotate(-4deg); -o-transform: rotate(-4deg); } 80% { transform: rotate(4deg); -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg); -o-transform: rotate(4deg); } to { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); }  } .css3 #listArts .link .titre { -webkit-transition: color 300ms ease-in-out; -moz-transition: color 300ms ease-in-out; -o-transition: color 300ms ease-in-out; -ms-transition: color 300ms ease-in-out; transition: color 300ms ease-in-out; }
.css3 #artLeft:hover img { -webkit-animation: rotate-anim2 0.25s linear 1; -moz-animation: rotate-anim2 0.25s linear 1; -ms-animation: rotate-anim2 0.25s linear 1; -o-animation: rotate-anim2 0.25s linear 1; animation: rotate-anim2 0.25s linear 1; }
@-webkit-keyframes rotate-anim2 { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); } 50% { transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -o-transform: rotate(-180deg); } to { transform: rotate(-360deg); -webkit-transform: rotate(-360deg); -moz-transform: rotate(-360deg); -o-transform: rotate(-360deg); }  } @-moz-keyframes rotate-anim2 { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); } 50% { transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -o-transform: rotate(-180deg); } to { transform: rotate(-360deg); -webkit-transform: rotate(-360deg); -moz-transform: rotate(-360deg); -o-transform: rotate(-360deg); }  } @-o-keyframes rotate-anim2 { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); } 50% { transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -o-transform: rotate(-180deg); } to { transform: rotate(-360deg); -webkit-transform: rotate(-360deg); -moz-transform: rotate(-360deg); -o-transform: rotate(-360deg); }  } @keyframes rotate-anim2 { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); } 50% { transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -o-transform: rotate(-180deg); } to { transform: rotate(-360deg); -webkit-transform: rotate(-360deg); -moz-transform: rotate(-360deg); -o-transform: rotate(-360deg); }  } .css3 #artRight:hover img { -webkit-animation: rotate-anim3 0.25s linear 1; -moz-animation: rotate-anim3 0.25s linear 1; -ms-animation: rotate-anim3 0.25s linear 1; -o-animation: rotate-anim3 0.25s linear 1; animation: rotate-anim3 0.25s linear 1; }
@-webkit-keyframes rotate-anim3 { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); } 50% { transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); } to { transform: rotate(360deg); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); }  } @-moz-keyframes rotate-anim3 { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); } 50% { transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); } to { transform: rotate(360deg); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); }  } @-o-keyframes rotate-anim3 { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); } 50% { transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); } to { transform: rotate(360deg); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); }  } @keyframes rotate-anim3 { from { transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); } 50% { transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); } to { transform: rotate(360deg); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); }  } 




/* ################################### INDEX.PHP ############################## */
/* ############################################################################ */