@font-face{
	font-family: picto_brand;
	src: url(../font/fa-brands-400.woff2);
}
@font-face{
	font-family: picto_solid;
	src: url(../font/fa-solid-900.woff2);
}
@font-face{
	font-family: roboto_bold;
	src: url(../font/RobotoCondensed-Bold.ttf);
}
@font-face{
	font-family: roboto_light;
	src: url(../font/RobotoCondensed-Light.ttf);
}

html, body{ border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; margin: 0; padding: 0; }
body{ display: block; margin: 0; padding: 0; font-family: roboto_bold, Arial, Helvetica, sans-serif; line-height: 1.5; background-color: #f0f2f2; font-size: 14px; color: #222; }
a, li, input[type="submit"]{ transition: color 300ms, background-color 300ms, opacity 300ms; -moz-transition: color 300ms, background-color 300ms, opacity 300ms; -o-transition: color 300ms, background-color 300ms, opacity 300ms; -webkit-transition: color 300ms, background-color 300ms, opacity 300ms; }
.clear{ clear: both; }
a{ color: #3C904D; text-decoration: none; }
a:hover{ color: #222; text-decoration: none; }

.discdrivin{ }
.header{ background-color: #fff; border-bottom: 1px solid #ddd; }
.header_zone{ width: 96%; padding: 0 2%; max-width: 1100px; margin: 0 auto; }
.menu{ float: right; padding: 18px 0; }
.menu a{ color: #222; font-size: 1.1em; border-right: 1px solid #bbb; padding: 0 10px 0 6px; font-weight: bold; text-transform: uppercase; }
.menu a:last-child{ border: 0; }
.menu a:hover{ color: #3C904D; }
.logo{ float: left; min-width: 270px; }
.logo h1{ padding: 0; margin: 0; border: 0; }
.logo img{ width: auto; margin: 12px 0; max-width: 180px; }
h1{ border-bottom: 1px solid #222; padding-bottom: 6px; }
.slide{ background-image: url("../images/fond5.jpg"); background-repeat: no-repeat; background-position: center; background-size: cover; height: 300px; }

table.tablesorter{ width: 100%; border-spacing: unset; }
table.tablesorter thead{ text-align: left; padding: 5px; background-color: #fff; }
table.tablesorter tbody{ font-family: roboto_light, Arial, Helvetica, sans-serif; }
table.tablesorter th{ padding: 10px; cursor: pointer; }
table.tablesorter th:hover{ color: #0c5800; }
table.tablesorter td{ padding: 5px 10px; border-bottom: 1px solid #e0e0e0; }
table.tablesorter .header:after{ content: "\f054"; font-family: "picto_solid"; padding-left: 15px; }
table.tablesorter .headerSortDown:after{ content: "\f078"; }
table.tablesorter .headerSortUp:after{ content: "\f077"; }
table.tablesorter tr{ background-color: #fff; }
table.tablesorter tr.leader{ background-color: #e5f5e8; }
table.tablesorter tr.coLeader{ background-color: #e5f5e8; }
table.tablesorter tr.elder{ background-color: #fbf9ee; }
table.tablesorter tr.member{ background-color: #fff; }

.footer{ padding: 0 0 0 0; }
.footer_zone{ background-color: #0c0c0c; padding: 20px 0; border-top: 1px solid #ddd; color: #fff; }
.footer_milieu{ display: block; margin: 0 auto; width: 96%; padding: 0 2%; max-width: 1100px; }
.footer .footer_block{ padding: 0; margin: 0; list-style: none; display: flex; }
.footer .footer_block >li{ width: 46%; padding: 0 2%; list-style: none; float: left; }
.footer .footer_block >li img{ max-width: 100%; }
.footer .footer_block .footer_block_1 img{ width: 150px; }
.footer .footer_block .footer_block_1{ padding-left: 0; position: relative; }
.footer .footer_block .footer_block_4{ text-align: center; }
.footer .footer_block li h3{ font-size: 18px; padding: 10px 0; font-weight: 700; }
.footer .footer_block .footer_liste_lien{ position: relative; list-style: none; margin: 0px; padding: 0; }
.footer .footer_block .footer_liste_lien li{ margin-bottom: 10px; padding-left: 25px; line-height: 20px; padding-bottom: 10px; border-bottom: 1px solid #444; }
.footer .footer_block .footer_liste_lien li:last-child{ border-bottom: none; }
.footer .footer_block a{ text-decoration: none; }
.footer .footer_block a:hover{ text-decoration: none; }
.footer .footer_block .footer_liste_lien li:before{ content: "\f105"; font-family: "picto_solid"; text-align: center; position: absolute; left: 0px; display: block; height: 20px; width: 20px; margin-top: -1px; }

.content{ position: relative; min-height: 400px; margin: 20px auto; max-width: 100%; width: 96%; padding: 0 2%; }
.content .content_block input[type="text"], .content .content_block input[type="email"], .content .content_block textarea{ background-color: #fff; padding: 16px 20px; width: 100%; border: none; max-width: 100%; }
.content .content_block input[type="text"]:focus, .content .content_block input[type="email"]:focus, .content .content_block textarea:focus{ outline-color: #0c5800; }
.content .content_block button{ background-color: #0c5800; padding: 15px 25px; color: #fff; font-weight: bold; border: none; cursor: pointer; }
.content .content_block button:hover{ background-color: #3C904D; }
.content .content_block .contact_input{ display: block; padding-right: 40px; position: relative; margin: 0 0 30px 0; }
.content .icon-error:before{ font-family: "picto_solid"; padding-right: 5px; content: "\f062"; }
.content .icon-check:before{ font-family: "picto_solid"; padding-right: 5px; content: "\f00c"; }
.content .messages{ width: calc(100% - 2px); border: 1px solid #dfebb5; color: #95bc01; background-color: #f7fde1; font-weight: bold; list-style: none; padding: 0; }
.content .messages li{ padding: 10px 20px; }
.content .error-msg{ color: #ff0000; font-size: 12px; display:none; padding-top: 3px; }
.content .clans{ padding: 0; list-style: none; max-width: 1100px; margin: 0 auto; }
.content .clan ul{ list-style: none; padding: 0; margin: 0; }
.content .clan li{ background-color: #fff; margin: 15px 2.1% 15px 0; float: left; width: 31.5%; border-radius: 5px; border: 1px solid #fff; box-shadow: 1px 2px 2px 0px rgba(0,0,0,0.1); }
.content .clan li .content_li{ padding: 15px; min-height: 135px; }
/* .content .clan li.left{ background-image: url("../images/clan-left.png"); background-repeat: no-repeat; background-position: right bottom; } */
.content .clan li:last-child{ margin-right: 0; }
.content .clan p.count_50{ color: #ef4542; }
.content .clan h2 a{ line-height: 50px; color: #222; font-size: 1.4em; }
.content .clan img{ margin-bottom: -15px; padding-right: 20px; max-height: 50px; }
.content .clans p{ margin: 0.5em 0; }
.content .clan li p:before{ font-family: "picto_solid"; padding-right: 15px; font-size: 1.1em; color: #222; }
.content .clan .left p:nth-child(2):before{ content: "\f292"; }
.content .clan .left p:nth-child(3):before{ content: "\f015"; }
.content .clan .middle p:nth-child(1):before{ content: "\f521"; }
.content .clan .middle p:nth-child(2):before{ content: "\f091"; }
.content .clan .middle p:nth-child(3):before{ content: "\f06b"; }
.content .clan .middle p:nth-child(4):before{ content: "\f0c0"; }
.content .clan .right p:nth-child(1):before{ content: "\f5a2"; }
.content .clan .right p:nth-child(2):before{ content: "\f1e2"; }
.content .clan .right p:nth-child(3):before{ content: "\f1e2"; }
.content .clan .right p:nth-child(4):before{ content: "\f1b8"; }
.content .tab_plus{ position: absolute; right: 20px; margin: 0; }
.content .tab_plus:before{ font-family: "picto_solid"; font-size: 2em; color: #3C904D; content: "\f055"; cursor: pointer; }
.content #tab_moins{ display: none; }
.content #tab_moins:before{ content: "\f056"; }
.content .tab_plus:hover:before{ color: #222; }
.statistiques table.tablesorter tr >th.affiche{ display: table-cell !important; }
.statistiques table.tablesorter tr >td.affiche{ display: table-cell !important; }

.header_zone:after,
.content .clan:after,
.content .list_clan:after
{ content: ''; display: table; clear: both; }

@media only screen and (max-width: 1100px){
	.statistiques table.tablesorter tr >th:nth-child(8),
	.statistiques table.tablesorter tr >td:nth-child(8){ display: none; }
	.statistiques table.tablesorter tr >th:nth-child(10),
	.statistiques table.tablesorter tr >td:nth-child(10){ display: none; }
}
@media only screen and (max-width: 1000px){
	.statistiques table.tablesorter tr >th:nth-child(7),
	.statistiques table.tablesorter tr >td:nth-child(7){ display: none; }
}
@media only screen and (max-width: 800px){
	.logo{ text-align: center; }
	.logo img{ max-width: 200px; width: 80%; }
	.header_zone{ text-align: center; }
	.header_zone >div{ float: none; }
	.menu{ padding: 10px 0; }
	.slide{ height: 200px; }
	.footer_milieu{ max-width: 450px; padding: 0 4%; width:92%; }
	.footer .footer_block >li{ width: auto; padding: 0 2%; list-style: none; float: none; }
	.footer .footer_block .footer_block_4 img{ max-width: 300px; }
	.statistiques table.tablesorter tr >th:nth-child(5),
	.statistiques table.tablesorter tr >td:nth-child(5){ display: none; }
	.statistiques table.tablesorter tr >th:nth-child(6),
	.statistiques table.tablesorter tr >td:nth-child(6){ display: none; }
	table.tablesorter .header:after{ padding-left: 10px; }
	.content .clan li{ margin: 10px 0 10px 0; width: 48.5%; }
	.content .clan li:first-child{ margin-right: 2.3%; }
	.content .clan li:last-child{ width: 100%; }
}
@media only screen and (max-width: 700px){
	h1{ font-size: 1.7em; }
	.statistiques table.tablesorter tr >th:nth-child(4),
	.statistiques table.tablesorter tr >td:nth-child(4){ display: none; }
}
@media only screen and (max-width: 600px){
	.menu{ padding: 8px 0; }
	.menu a{ font-size: 1em; padding: 0 6px 0 2px; text-transform: unset; }
	.slide{ height: 150px; }
	.content .clan .right,
	.content .clan .middle,
	.content .clan .left{ float:none; width: 100%; margin-right: 0; }
	.content .clan li .content_li{ min-height: auto; }
	.statistiques table.tablesorter tr >th:nth-child(11),
	.statistiques table.tablesorter tr >td:nth-child(11){ display: none; }
	.statistiques table.tablesorter tr >th >span{ display: none; }
	table.tablesorter .header:after{ padding-left: 5px; }
}
@media only screen and (min-width: 1100px){
	.content .tab_plus{ display: none; }
}