@charset "utf-8";

/* erreur IE */
html {font-size: 100%; margin: 0; padding: 0;}	

/* class */
.float_left {float:left;}
.float_right {float:right;}
.anti_float {clear:both;}
.txtcenter {text-align: center;}
.transition { -webkit-transition: all 0.3s ease;
              -moz-transition: all 0.3s ease;
              -o-transition: all 0.3s ease;
               transition: all 0.3s ease; }
.gras {font-weight: bold;}
.blocpath {padding-top: 20px;}
 
/* BASE */
body {
	margin: 0; padding: 0;
	font-family: Verdana, "DejaVu Sans", "Bitstream Vera Sans", Geneva, sans-serif;
	background-color: #fff;
	color: black;}
header, section, footer, aside, nav, article, figure {display: block;}
a img {border: none;}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 
	padding-right: 15px;
	padding-left: 15px;}
main, footer {
	width:96%;
	max-width: 1700px;
	margin:0 auto;}

/* HEADER */
header {width: 100%;}
a#logo {display : table; margin : 0 auto; height: 210px;padding-top: 15px;}
a#logo img {height: 190px;}
a#logo:hover img , a#logo:focus img {height: 200px;}

/* Nav */
main nav {width: 100%; background-color: #d19e66;min-height: 30px;}
main nav ul {
margin : 0;
padding : 0;
text-align : center;
list-style : none;}
main nav ul li {display : inline-block;}
main nav a {
cursor : pointer;
color : #fff;
background-color:#d19e66;
display : block;
text-align : center;
text-decoration : none;
height: 40px;
line-height: 40px;
padding: 0 15px;}
main nav a:hover, main nav a:active, main nav a:focus {color : #000;background-color: #fff;}

/* Slide */
#slider {margin-top: 30px;}
/* Tiny Slide */
#tinyslider .slick-list {max-height: 220px;}
#tinyslider .slick-dots {bottom: -35px;}
#tinyslider .slick-dots li button {background: #f3f3f3; border-radius: 10px; border:1px solid #d0d0d0;}
#tinyslider .slick-dotted.slick-slider {margin-bottom: 33px;}
a.bt-articles {color: #000; text-decoration: none;}
a.bt-articles:hover, a.bt-articles:focus {color:#d19e66; text-decoration:underline;}
#tinyslider .slick-prev,#tinyslider .slick-next {border-radius: 5px; width: 40px; height: 50px; background:#f7f7f76e; }
#tinyslider .slick-next {right: 15px;}
#tinyslider .slick-prev {left: 15px;}

a.bt-selection {color: #fff; text-decoration: none; border: 2px solid #d19e66; background-color:#d19e66; padding: 10px; font-size: large; margin: 5px;display: inline-block;}
a.bt-selection:hover, a.bt-selection:focus {background-color: #fff; border: 2px solid #d19e66; color:#d19e66; text-decoration:none;}

/* Main */
.border { border: solid black 2px; }
section h1 {padding-top: 22px;}

/* Article */
article {width: 100%;}
.presentation {margin:15px auto;padding: 15px 0; max-width: 1000px; display: block;}

/* Aside */
aside {width: 100%;}

/* Footer */
a#mailto {color:#d19e66; text-decoration: none;}
a#mailto:hover, a#mailto:focus {color: #000; text-decoration: underline;}
.blocfooter {display: block; width: 25%;min-height: 1px;}
footer {width: 100%; min-height: 80px; color: #000; padding: 25px 0; border-top: 2px solid black;
margin-top: 25px;margin-bottom: 15px;}
footer img {max-width: 240px; padding-left: 15px;}
footer #coordonnees {padding-left: 15px;}
footer #coordonnees p {padding: 0; margin: 2px;}
footer nav {}
footer ul {margin: 10px 15px; padding: 0;}
footer li {margin: 6px auto; list-style: none;}
footer li a {color: #d19e66;text-decoration : none; font-weight: 400; }
footer li a:hover, footer li a:focus {color:#000; text-decoration:underline; font-weight: 600;}
#social {margin: 10px 15px;}
#social a {width: 92px; text-indent: 100%; overflow: hidden; display: block;
background-image: url(https://hyodall.com/img/cms/logos/linkedin-logo.png); background-position: center;
background-repeat: no-repeat; background-size: auto 25px;}
#social a:hover, #social a:focus {background-image: url(https://hyodall.com/img/cms/logos/linkedin-colorised.png);}

/* articles funeraires */
.grid {column-count: 4;}
nav#nav-articles {background-color: #fff;}
nav#nav-articles ul {margin: 15px auto;}
nav#nav-articles li {}
nav#nav-articles li a {margin: 4px 2px;}
.list-articles li {text-align: left;}

/* responsive */
@media only screen and (max-width:1000px) {
	#slider {width: 100%; margin: 0 auto;}
	.slick-slide img {max-height: 300px;}
}
@media only screen and (max-width:860px) {
	.grid {column-count: 3;}
}
@media only screen and (max-width:800px) {
	footer {width: 90%; margin: 0 auto;}
	.blocfooter {width: 100%;margin-top: 10px;}
}
@media only screen and (max-width:750px) {
	#slider {margin-top: 30px; margin-bottom: 20px;}
	.slick-slide img {max-height: 190px;}
}
@media only screen and (max-width:600px) {
	main nav ul {column-count: 2;}
	#tinyslider .slick-dots li {margin: 0 5px;}
	section img {width: 100%;}
	.grid {column-count: 2;}
}