/*@import url("http://fast.fonts.net/t/1.css?apiType=css&projectid=0cf54db9-e089-4740-be33-e503b32bbb29");*/
@font-face{
font-family:"ElegantGaramondW01-Roma";
src:url("Fonts/d8f6d69b-3ff8-4312-bc39-c8fb1f2a54ea.eot?#iefix");
src:url("Fonts/d8f6d69b-3ff8-4312-bc39-c8fb1f2a54ea.eot?#iefix") format("eot"),url("Fonts/3cfd86b0-772a-48d4-acca-0360328e9c63.woff") format("woff"),url("Fonts/097414d1-d5cc-4d92-97f6-354450c67cdf.ttf") format("truetype"),url("Fonts/b89bfbde-d4a8-4b6c-a2e0-c9f4328b8269.svg#b89bfbde-d4a8-4b6c-a2e0-c9f4328b8269") format("svg");
}
@font-face{
font-family:"ElegantGaramondW01-Ital";
src:url("Fonts/f642cad3-4ea4-48b5-8976-e315525f0b95.eot?#iefix");
src:url("Fonts/f642cad3-4ea4-48b5-8976-e315525f0b95.eot?#iefix") format("eot"),url("Fonts/b72f338a-4a19-40d0-9a1c-31c6dcb12649.woff") format("woff"),url("Fonts/12b2df47-151d-46d6-8941-5134e0bac269.ttf") format("truetype"),url("Fonts/910e2b39-5004-4bd3-a8a6-ca11a294a39b.svg#910e2b39-5004-4bd3-a8a6-ca11a294a39b") format("svg");
}
/** ====================================================
   GLOBAL RESET
====================================================== */
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0; }
table { border-collapse:collapse; border-spacing:0; }
fieldset, img { border:0; }
address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal; } 
ol, ul, li { list-style:none; }
caption, th { text-align:left; }
h1, h2, h3, h5, h5, h6 { font-size:100%; }
q:before, q:after { content:''}

strong { font-weight: bold; }
em { font-style: italic; }
ol, ul, li { list-style:none; }

html>body * a { position:relative; }  /* Gets links displaying over a PNG background, html>body n'est pas compris par IE6 */
a { outline:none; } /* Gets rid of Firefox's dotted borders */
a img { border:none; } /* Gets rid of IE's blue borders */
/*img { display: block; }*/
table { border:none; border-collapse:collapse;  }
table td { vertical-align:top; }

/* ======================================================
   GENERIQUE
====================================================== */
html { width:100%; }
body { width:100%; font:0.9em/1.5em arial,helvetica,sans-serif; color:#1e1e1e; text-align:center; background:#3f1d03 url('/images/template/body-bg.png') top left repeat-x; }

h1 { padding:0.3em 0; font:normal 2.8em/1em "ElegantGaramondW01-Roma",Georgia,Times,serif; color:#9ea1a3; }
h2 { padding:0.5em 0; font:normal 2.1em/1em "ElegantGaramondW01-Roma",Georgia,Times,serif; color:#9ea1a3; }
h3 { padding:0.5em 0; font:bold 1.0em/1em arial,helvetica,sans-serif; color:#9ea1a3; }
h4 { padding:0.5em 0; font:bold 1.0em/1em arial,helvetica,sans-serif; color:#1e1e1e; }
h5 { padding:0.5em 0; font:bold 1.0em/1em arial,helvetica,sans-serif; color:#1e1e1e; }
h6 { padding:0.5em 0; font:bold 1.0em/1em arial,helvetica,sans-serif; color:#1e1e1e; }

a { color:#ec7205; font-weight:normal; text-decoration:underline; }
a:link { color:#ec7205; font-weight:normal; text-decoration:underline; }
a:focus { color:#ec7205; font-weight:normal; text-decoration:underline; }
a:hover { color:#ec7205; font-weight:normal; text-decoration:underline; }

p { padding:0.5em 0; }
img { border:none; }

td { padding:2px 4px 2px 4px; font-family:arial,helvetica,sans-serif; font-size:13px; }
hr { display:block; margin:0; padding:0; border:none; background-color:#b4b4b4; color:#b4b4b4; font-size:1px; height:1px; line-height:1px; }

/* ======================================================
   MAIN, CONTENT
====================================================== */
#global {
	position:relative;
	/*width:100%;
	min-height:784px;*/
	background:transparent url('/images/template/global-bg.jpg') top center no-repeat;
}
#page { position:relative; margin:0 auto; padding-top:182px; width:964px; }
#content {
	padding:0 0 0 300px;
	min-height:760px;
	background:#fff url('/images/template/leftcol-bg.png') top left repeat-y;
	text-align:left;
}
#text {
	padding:60px 25px 30px;
}

/* ======================================================
   HEADER
====================================================== */
#header {
	position:absolute;
	top:182px;
	left:0;
	width:300px;
	background:#fff url('/images/template/logo-bg.png') top left repeat-x;
	text-align:center;
}

/* ======================================================
   FOOTER
====================================================== */
#footer {
	position:absolute;
	bottom:0px;
	left:0px;
	margin-bottom:1em;
	width:300px;
	font-size:0.7em;
	line-height:1.3em;
	color:#f9f9f9;
	text-align:center;
}
#footer a, #footer a:hover, #footer a:focus { color:#f9f9f9; text-decoration:none; }

/* ======================================================
   MENU
====================================================== */
#nav { 	
	position:absolute;
	top:407px;
	left:0; 
	padding:0;
	width:300px;
	background-color:#e17c2b;
	text-align:center;
}
#menu {
	font-family:"ElegantGaramondW01-Roma";
}
#menu .btn-menu {
	border-bottom:1px solid #ea9c50;
}
#menu .active, #menu .btn-menu:hover, #menu .btn-menu:focus { background-color:#623002; }
#menu .btn-menu a {
	display:block;
	padding:0.4em 0;
	color:#f9f9f9;
	font-size:2.1em;
	text-decoration:none;
}
#menu .sub-menu {
	padding:0 0 0.4em;
	font-family:"ElegantGaramondW01-Ital";
}
#menu .sub-menu .btn-smenu a {
	display:block;
	padding:0.2em 0 0.2em;
	font-size:1.5em;
	text-decoration:none;
}
#menu a:hover, #menu a:focus { background-color:#813f03; }
#menu a.active { background-color:#813f03; }

/* ======================================================
   CLASSES and *
====================================================== */
.imgToLeft { float:left; margin: 0 1em 0.5em 0; max-width: 300px; }
.imgToRight { float:right; margin: 0 0 0.5em 1em; }
.clearing {clear:both; }
.invisible { display:none; }
.small { font-size:0.7em; line-height:1.5em; }
#content ul { margin:0; padding:5px 0 1em 0; }
#content ul li { float:none; list-style:disc outside; margin:0 0 0 14px }
.transparent { zoom: 1; filter: alpha(opacity=90); opacity: 0.9; }
.clear-fix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
.clear-fix { zoom: 1; } /** IE 5.5/6/7 */

a.telephone { display:block; margin:1em 0 0; font-size:1.2em; font-weight:bold; color:#f9f9f9; text-decoration:none; }
a.telephone:hover, a.telephone:focus { color:#f9f9f9; text-decoration:none; }

div.news { clear:both; padding:1em 0; }
.introduction { padding-bottom:1em; font:normal 1.5em/1.2em "ElegantGaramondW01-Ital",Georgia,Times,serif; }
.blk-photos { float:right; margin:1em 0 1em 1em; width:212px;  }
.blk-photos img { width: 100%; }
a.fbLink { display:inline-block; margin:3em auto 0; padding:0 0 0 38px; line-height:32px; color:#fff; text-decoration:none; background:transparent url('../images/template/logo-facebook.png') no-repeat center left; }

/***********ICONS*************/
.arrows-icons { background-color: transparent; background-image: url('images/arrows.png'); background-repeat: no-repeat; width: 21px; height: 21px; }
.arrow-right { background-position: -49px 0; }
.arrow-down { background-position: 0 0; }
.arrow-up { background-position: -25px 0; }

/*********LIST************/
.list-set { margin-top: 5px; }
.list-set .first-child { border-top: 1px solid #E6E6E6; }
.list-item { border-bottom: 1px solid #E6E6E6; position: relative; }
.list-item .list-normal-header { padding: 15px 0; font-family: Georgia; font-size: 16px; font-weight: normal; }
.list-item .list-normal-content { font-size: 1.3em; padding: 10px 0; }
.list-item .list-normal-content p { margin-bottom: 10px; }

.list-item .list-collapsible-header { font-size: 16px; font-weight: normal; position: relative; }
.list-collapsible-header .arrow-link { margin-top: -10px; position: absolute; right: 10px; top: 50%; }
.list-collapsible-header a { color: #616365; display: block; font-family:Georgia; padding: 15px 0; text-decoration: none; text-transform: lowercase; }
.open .list-collapsible-header a { color: #C60C30; }
.list-item .list-collapsible-content { display: none; font-size: 13px; padding: 10px 0 20px; }

#content ul.list-medailles {  }
#content ul.list-medailles li { list-style:none; margin:0.5em 0; padding:25px 80px; background:#fff url('../images/medaille-or-2008.png') center left no-repeat; }
#content ul.list-medailles li.or2008 { background-image:url('../images/medaille-or-2008.png'); }
#content ul.list-medailles li.or2010 { background-image:url('../images/medaille-or-2010.png'); }
#content ul.list-medailles li.argent2008 { background-image:url('../images/medaille-argent-2008.png'); }
#content ul.list-medailles li.argent2010 { background-image:url('../images/medaille-argent-2010.png'); }
#content ul.list-medailles li.argent2012 { background-image:url('../images/medaille-argent-2012.png'); }
#content ul.list-medailles li.bronze2014-2015 { background-image:url('../images/medaille-bronze-2014-2015.png'); }

/*********SLIDER***********/
.mi-slider { position: relative; }
.mi-slider .slides-container { overflow: hidden; position: absolute; width: 100%; height: 100%; }
.mi-slider .slide { 
	position: absolute;
	width: 100%;
	height: 100%;
} 
.mi-slider .slider-btn {
	background: url("../images/transparent.png") repeat scroll 0 0 transparent;
	cursor: pointer;
	position: absolute;
	top: 0;
	bottom: 0;
	width: 15px;
}
.mi-slider .btn-left { background-position: 0 0; left: -20px; }
.mi-slider .btn-right { background-position: -13px 0; right: -20px; }

#slider, #slider-top { border: 1px solid; float: left; margin-right: 10px; height: 240px; width: 388px; }

/* ======================================================
   FORMULAIRES
====================================================== */
form { margin:0 0 10px 0; }
fieldset { padding:1em; margin:0 0 1em 0; border:1px solid #813f03; width:500px; }
legend { font-weight:bold; color:#813f03; padding:5px 5px 5px 5px; }
label { display:block; margin:0; padding:0; vertical-align:middle; font-weight:normal; cursor:pointer; }
form p { margin:0.5em 0; padding:0; }
form p label { float:left; width:172px; height:30px; line-height:30px; text-align:left; white-space:no wrap; }
textarea { border:1px solid #813f03; padding:0.2em 0.5em; font-family:arial,helvetica,sans-serif; font-size:1em; width:350px; height:160px; background-color:#fff; border-radius:5px; }
.form-field { padding:0 0.5em; width:200px; height:30px; font-family:arial,helvetica,sans-serif; font-size:1em; color:#1e1e1e; background-color:#fff; border:1px solid #813f03; border-radius:5px; }
.form-button { padding:0.4em 1em; font-family:arial,helvetica,sans-serif; font-size:1em; color:#fff; background-color:#e17c2b; border:1px solid #e17c2b; border-radius:5px; cursor:pointer; }
.form-button:hover, .form-button:focus { background-color:#813f03; }
.code-image { margin-top:1em; font-size:1em; }
#form-contact .code-image label {
    margin-bottom: 5px;
    width: 90%;
}
#form-contact .code-image .form-field {
    float: right;
    margin-right:225px;
}
#form-contact .code-image img {
    border: 1px solid #ccc;
    border-radius: 5px;
    float: left;
    margin: 0 10px 10px 0;
}

/* ======================================================
   MOBILE 
====================================================== */
@media (max-width: 640px) {
	/* passer tous les éléments de largeur fixe en largeur automatique */
	body, #global, #nav, #page, #content, #footer {
	width: auto;
	height:auto;
	min-height:inherit;
	margin: 0;
	padding: 0;
	background-image:none;
	}
	#header {
	position:relative;
	top:0;
	left:0;
	width: auto;
	height:auto;
	min-height:inherit;
	margin: 0;
	padding: 0;
	}
	#footer {
	position:relative;
	padding:1em 0;
	background-color:#e17c2b;
	}
	#nav { 	
	position:relative;
	top:0;
	left:0; 
	}
	#text {
	padding:1em 1.5em 1em;
	}
	.blk-photos { float:none; margin:1em 0; width:auto;  }
	/* fixer une largeur maximale  de 100 % aux éléments potentiellement problématiques */
	img, table, td, blockquote, code, pre, textarea, input, iframe, object, embed, video {
	max-width: 100%;
	}
	/* conserver le ratio des images et empêcher les débordements de boîtes dûs aux border ou padding */
	img {
	height: auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}
	/* gestion des mots longs */
	textarea, table, td, th, code, pre, samp {
	word-wrap: break-word; /* passage à la ligne forcé */
	-webkit-hyphens: auto; /* césure propre */
	-moz-hyphens: auto;
	hyphens: auto;
	}
	code, pre, samp {
	white-space: pre-wrap; /* passage à la ligne spécifique pour les éléments à châsse fixe */
	}
	/* Passer à une seule colonne (à appliquer aux éléments multi-colonnes) */
	element1, element2 {
	float: none;
	width: auto;
	}
	/* masquer les éléments superflus */
	.hide_mobile {
	display: none !important;
	}
	/* Un message personnalisé */
	body:after {
	content: "Version mobile du site";
	display: block;
	padding:0.5em;
	color: #777;
	text-align: center;
	font-style: italic;
	}
}
@media (max-device-width:768px) and (orientation: landscape) {
  html {
   -webkit-text-size-adjust: 100%;
  }
}