@charset "UTF-8";
@import url(//fonts.googleapis.com/css?family=Open+Sans:400,300,600,700);
/*
* Gumby Framework Version 2.0
* ---------------------------
* Follow @gumbycss on twitter and spread the love.
* We worked super hard on making this awesome and released it to the web.
* All we ask is you leave this intact. #gumbyisawesome
*
* http://www.gumbyframework.com/
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; }

* html { font-size: 100%; }

html { font-size: 16px; line-height: 1.625em; }

html * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

body { background: white; font-family: "Arial"; font-weight: 400; color: #555555; position: relative; -webkit-font-smoothing: antialiased; }
@media only screen and (max-width: 767px) { body { -webkit-text-size-adjust: none; -ms-text-size-adjust: none; width: 100%; min-width: 0; } }

.ie9 { font-family: "Open Sans"; }
.ie9 * { font-family: "Open Sans"; }

.hide { display: none; }

.hide.active, .show { display: block; }

.fixed { position: fixed; }
@media only screen and (max-width: 768px) { .fixed { position: relative !important; } }

/* Fonts */
@font-face { font-family: "entypo"; font-style: normal; font-weight: 400; src: url(../fonts/icons/entypo.eot); src: url("../fonts/icons/entypo.eot?#iefix") format("ie9-skip-eot"), url("../fonts/icons/entypo.woff") format("woff"), url("../fonts/icons/entypo.ttf") format("truetype"); }

h1, h2, h3, h4, h5, h6 { font-family: "Open Sans"; font-weight: Normal; color: #444444; text-rendering: optimizeLegibility; padding-top: 0.273em; line-height: 1.15538em; padding-bottom: 0.273em; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #d04526; }

@media only screen and (max-width: 767px) { h1, h2, h3, h4, h5, h6 { word-wrap: break-word; } }
h1 { font-size: 68px; font-size: 4.25rem; }
h1.xlarge { font-size: 110px; font-size: 6.875rem; }
h1.xxlarge { font-size: 126px; font-size: 7.875rem; }
h1.absurd { font-size: 177px; font-size: 11.0625rem; }

h2 { font-size: 42px; font-size: 2.625rem; }

h3 { font-size: 30px; font-size: 1.875rem; }

h4 { font-size: 26px; font-size: 1.625rem; }

h5 { font-size: 18px; font-size: 1.125rem; }

h6 { font-size: 16px; font-size: 1rem; }

@media only screen and (max-width: 767px) { h1 { font-size: 42px; font-size: 2.625rem; }
  h2 { font-size: 36px; font-size: 2.25rem; } }
.subhead { color: #777; font-weight: normal; margin-bottom: 20px; }

/*=====================================================  	Links & Paragraph styles 	 	======================================================*/
p { font-family: "Open Sans"; font-weight: 400; font-size: 16px; font-size: 1rem; margin-bottom: 13px; line-height: 1.625em; }
p.lead { font-size: 20px; font-size: 1.25rem; margin-bottom: 18px; }
@media only screen and (max-width: 768px) { p { font-size: 17.6px; font-size: 1.1rem; line-height: 1.625em; } }

a { color: #d04526; text-decoration: none; outline: 0; line-height: inherit; }
a:hover { color: #c03d20; }

/*=====================================================
 	Lists 	 ======================================================*/
ul, ol { margin-bottom: 0.273em; }

ul { list-style: none outside; }

ol { list-style: decimal; margin-left: 30px; }

ul.square, ul.circle, ul.disc { margin-left: 25px; }
ul.square { list-style: square outside; }
ul.circle { list-style: circle outside; }
ul.disc { list-style: disc outside; }
ul ul { margin: 4px 0 5px 25px; }

ol ol { margin: 4px 0 5px 30px; }

li { padding-bottom: 0.273em; }

ul.large li { line-height: 21px; }

dl dt { font-weight: bold; font-size: 16px; font-size: 1rem; }

@media only screen and (max-width: 768px) { ul, ol, dl, p { text-align: left; } }
/* Mobile */
em { font-style: italic; line-height: inherit; }

strong { font-weight: 700; line-height: inherit; }

small { font-size: 56.4%; line-height: inherit; }

h1 small, h2 small, h3 small, h4 small, h5 small { color: #777; }

/**
	 * Print styles.  Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/ Credit to Paul Irish and HTML5 Boilerplate (html5boilerplate.com) */
@media print { * { background: transparent !important; color: black !important; text-shadow: none !important; filter: none !important; -ms-filter: none !important; }
  /* Black prints faster: sanbeiji.com/archives/953 */
  p a { color: #555555 !important; text-decoration: none; }
  p a:visited { color: #555555 !important; text-decoration: none; }
  p a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after { content: ""; }
  a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  /* css-discuss.incutio.com/wiki/Printing_Tables */
  tr, img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; } }

/*.container { padding: 0px $gutter-in-px;
}*/
.row { width: 100%; max-width: 940px; min-width: 320px; margin: 0 auto; }
@media only screen and (max-width: 960px) { .row { padding: 0 20px; } }
.row .row { min-width: 0px; }
@media only screen and (max-width: 960px) { .row .row { padding: 0; } }

/* To fix the grid into a different size, set max-width to your desired width */
.column, .columns { margin-left: 2.12766%; float: left; min-height: 1px; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.column:first-child, .columns:first-child, .alpha { margin-left: 0px; }

.column.omega, .columns.omega { float: right; }

/* Column Classes */
.row .one.column, .row .one.columns, .two.colgrid .row .one.columns { width: 48.93617%; }
.row .two.columns { width: 100%; }

/* Push Classes */
.row .push_one { margin-left: 53.19149%; }
.row .push_one:first-child { margin-left: 51.06383%; }

/* Centered Classes */
.row .one.centered { margin-left: 25.53191%; }

/* Hybrid Grid Columns */
.two.colgrid .row .one.column, .two.colgrid .row .one.columns { width: 48.93617%; }
.two.colgrid .row .two.columns { width: 100%; }

/* Hybrid Push Classes */
.two.colgrid .row .push_one { margin-left: 53.19149%; }
.two.colgrid .row .push_one:first-child { margin-left: 51.06383%; }

/* Hybrid Centered Classes */
.two.colgrid .row .one.centered { margin-left: 25.53191%; }

.pull_right { float: right; }

.pull_left { float: left; }

img, object, embed { max-width: 100%; height: auto; }

img { -ms-interpolation-mode: bicubic; }

#map_canvas img, .map_canvas img { max-width: none !important; }

/* Tile Grid */
.tiles { display: block; overflow: hidden; }
.tiles > li { display: block; height: auto; float: left; padding-bottom: 0; }
.tiles.two_up { margin-left: -4%; }
.tiles.two_up > li { margin-left: 4%; width: 46%; }
.tiles.three_up, .tiles.four_up { margin-left: -2%; }
.tiles.three_up > li { margin-left: 2%; width: 31.3%; }
.tiles.four_up > li { margin-left: 2%; width: 23%; }
.tiles.five_up { margin-left: -1.5%; }
.tiles.five_up > li { margin-left: 1.5%; width: 18.5%; }

/* Nicolas Gallagher's micro clearfix */
.clearfix { *zoom: 1; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }

.row { *zoom: 1; }
.row:before, .row:after { content: ""; display: table; }
.row:after { clear: both; }

.valign { display: table; width: 100%; }
.valign > div { display: table-cell; vertical-align: middle; }
.valign ​ > article { display: table-cell; vertical-align: middle; }

/* Mobile */
@media only screen and (max-width: 767px) { body { -webkit-text-size-adjust: none; -ms-text-size-adjust: none; width: 100%; min-width: 0; }
  .container { min-width: 0; margin-left: 0; margin-right: 0; }
  .row { width: 100%; min-width: 0; margin-left: 0; margin-right: 0; }
  .row .row .column, .row .row .columns { padding: 0; }
  .row .centered { margin: 0 !important; }
  .column, .columns { width: auto !important; float: none; margin-left: 0; margin-right: 0; }
  .column:last-child, .columns:last-child { margin-right: 0; float: none; }
  [class*="column"] + [class*="column"]:last-child { float: none; }
  [class*="column"]:before { display: table; }
  [class*="column"]:after { display: table; clear: both; }
  [class^="push_"], [class*="push_"] { margin-left: 0 !important; } }


/* Tabs */
.tabs { display: block; }
.tabs .tab-nav { margin: 0; padding: 0; border-bottom: 1px solid #e5e5e5; }
.tabs .tab-nav > li { position: relative; display: inline-block; width: auto; padding: 0; margin: 0 2.12766% 0 0; cursor: default; top: 1px; }
.tabs .tab-nav > li > a { display: block; width: auto; padding: 0 16px; margin: 0; color: #555555; font-family: "Open Sans"; font-weight: 600; border: 1px solid #e5e5e5; border-width: 1px 1px 0 1px; text-shadow: 0 1px 1px white; background: #f2f2f2; cursor: pointer; -webkit-border-radius: 4px 4px 0 0; -moz-border-radius: 4px 4px 0 0; -ms-border-radius: 4px 4px 0 0; -o-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; height: 42px; line-height: 40px; }
.tabs .tab-nav > li > a:hover { text-decoration: none; background: whitesmoke; }
.tabs .tab-nav > li > a:active { background: #ededed; }
.tabs .tab-nav > li.active > a { height: 43px; line-height: 41px; background: #fff; }
.tabs .tab-nav > li:last-child { margin-right: 0; }
.tabs .tab-content { display: none; padding: 20px 10px; }
.tabs .tab-content.active { display: block; }
.tabs.pill .tab-nav { width: 100%; /* remove if you dont want the tabs to span the full container width */ display: table; overflow: hidden; border: 1px solid #e5e5e5; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; }
.tabs.pill .tab-nav > li { display: table-cell; margin: 0; margin-left: -4px; text-align: center; top: 0; }
.tabs.pill .tab-nav > li:first-child { margin-left: 0; }
.tabs.pill .tab-nav > li > a { border: none; border-right: 1px solid #e5e5e5; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; height: 42px; line-height: 40px; }
.tabs.pill .tab-nav > li:last-child > a { border-right: none; }
.tabs.vertical .tab-nav { border: none; }
.tabs.vertical .tab-nav > li { display: block; margin: 0; margin-bottom: 5px; }
.tabs.vertical .tab-nav > li.active { position: relative; z-index: 99; }
.tabs.vertical .tab-nav > li.active > a { border-right: 1px solid white; }
.tabs.vertical .tab-nav > li > a { border: 1px solid #e5e5e5; -webkit-border-radius: 4px 0 0 4px; -moz-border-radius: 4px 0 0 4px; -ms-border-radius: 4px 0 0 4px; -o-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; }
.tabs.vertical .tab-content { padding: 10px 0 30px 20px; margin-left: -1px; border-left: 1px solid #e5e5e5; }

body .video { width: 100%; position: relative; height: 0; padding-bottom: 56.25%; }
body .video.twitch, body .video.youtube.show_controls { padding-top: 30px; }

.video > video, .video > iframe, .video > object, .video > embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/*=====================================================
 Navigation (with dropdowns)
 ======================================================*/
.navbar { width: 100%; display: block; margin-bottom: 20px; background: #4a4d50; height:120px; }
@media only screen and (max-width: 767px) { .navbar { position: relative; border: none; }
  .navbar .column, .navbar .columns { min-height: 0; } }
.navbar.fixed { top: 0; left: 0; z-index: 99999; }
.navbar a.toggle { display: none; }
@media only screen and (max-width: 767px) { .navbar a.toggle { top: 18%; right: 4%; width: 46px; position: absolute; text-align: center; display: inline-block; color: white; background: #4a4d50; height: 40px; line-height: 38px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; font-size: 30px; font-size: 1.875rem; }
  .navbar a.toggle:hover { background: #565a5d; }
  .navbar a.toggle:active, .navbar a.toggle.active { background: #3e4043; } }
.navbar .logo { display: inline-block; margin: 0 2.12766% 0 0; padding: 0; height: 62px; line-height: 58px; }
.navbar .logo a { display: block; padding: 5px 5px 0 5px; overflow: hidden; height: 60px; line-height: 58px; }
@media only screen and (max-width: 767px) { .navbar .logo { float: left; display: inline; }
  .navbar .logo a { padding: 0; }
  .navbar .logo a img { width: auto; max-width: 100%; } }
.navbar ul { display: table; vertical-align: middle; margin: 0; float: none;}
@media only screen and (max-width: 767px) { .navbar ul { position: absolute; display: block; width: 100% !important; height: 0; max-height: 0; top: 60px; left: 0; overflow: hidden; text-align: center; background: #3e4043; }
  .navbar ul.active { height: auto; max-height: 600px; z-index: 999999; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-box-shadow: 0 2px 2px #252728; -moz-box-shadow: 0 2px 2px #252728; box-shadow: 0 2px 2px #252728; } }
.navbar ul li { display: table-cell; text-align: center; padding-bottom: 0; margin: 0; height: 60px; line-height: 58px;}
@media only screen and (max-width: 767px) { .navbar ul li { display: block; position: relative; min-height: 50px; max-height: 320px; height: auto; width: 100%; border-right: 0 !important; -webkit-box-shadow: none; box-shadow: none; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; } }
.navbar ul li > a { display: block; padding: 0 16px; white-space: nowrap; color: white; text-shadow: 0 1px 2px #191a1b, 0 1px 0 #191a1b; height: 61px; line-height: 75px; font-size: 25px;}
.navbar ul li .btn { border-color: #000101 !important; }
.navbar ul li.field { margin-bottom: 0 !important; margin-right: 0; }
@media only screen and (max-width: 767px) { .navbar ul li.field { padding: 0 20px; } }
.navbar ul li.field input.search { background: #191a1b; border: none; color: #f2f2f2; }
.navbar ul li:hover > a { position: relative; background: #868d92; z-index: 1000; }
.navbar ul li .dropdown { width: auto; min-width: 0px; max-width: 320px; height: 0; position: absolute; background: #fafafa; overflow: hidden; z-index: 999; }
.navbar ul li:hover .dropdown { min-height: 30px; max-height: 561px; overflow: visible; height: auto; width: 100%; padding: 0; border-top: 1px solid #3e4043; -webkit-box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.3); box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.3); }
@media only screen and (max-width: 767px) { .navbar ul li .dropdown { width: 100%; max-width: 100%; position: relative; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; }
  .navbar ul li:hover .dropdown { border-bottom: 1px solid #313436; }
  .navbar ul li:hover .dropdown ul { position: relative; top: 0; background: #36393b; min-height: 50px; max-height: 250px; height: auto; overflow: scroll; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; }
  .navbar ul li:hover .dropdown ul li { min-height: 30px; border-bottom: #3e4043; }
  .navbar ul li:hover .dropdown ul li a { color: white; border-bottom: 1px solid #313436; }
  .navbar ul li:hover .dropdown ul li a:hover { color: #d04526; } }
@media only screen and (min-width: 768px) and (max-width: 939px) { .navbar > ul > li > .btn a { padding: 0 10px 0 10px !important; }
  .navbar ul > li .dropdown ul li:hover .dropdown { left: -320px; } }

/**** Navbar positioning for Microsoft's browser who deserves not to be mentioned ****/
.ie7 .navbar > ul { width: auto; }

.ie7 .navbar, .ie7 .navbar > ul > li > a { display: block; }

.ie7 .navbar .logo, .ie7 .navbar ul, .ie7 .navbar ul li { float: left; display: inline-block; }

.ie7 .navbar .logo a { display: block; overflow: hidden; }

.ie7 .navbar > ul > li .field { display: block; padding: 12px 18px 0; width: 80%; }

.pretty.navbar { background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #7b8085), color-stop(100%, #313436)); background-image: -webkit-linear-gradient(#7b8085, #313436); background-image: -moz-linear-gradient(#7b8085, #313436); background-image: -o-linear-gradient(#7b8085, #313436); background-image: linear-gradient(#7b8085, #313436); -webkit-box-shadow: inset 0 1px 1px #7b8085, 0 1px 2px rgba(0, 0, 0, 0.8) !important; /* Remove this line if you dont want a dropshadow on your navigation*/ box-shadow: inset 0 1px 1px #7b8085, 0 1px 2px rgba(0, 0, 0, 0.8) !important; /* Remove this line if you dont want a dropshadow on your navigation*/ }
@media only screen and (max-width: 767px) { .pretty.navbar a.toggle { border: 1px solid #3e4043; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #7b8085), color-stop(100%, #4a4d50)); background-image: -webkit-linear-gradient(#7b8085, #4a4d50); background-image: -moz-linear-gradient(#7b8085, #4a4d50); background-image: -o-linear-gradient(#7b8085, #4a4d50); background-image: linear-gradient(#7b8085, #4a4d50); -webkit-box-shadow: inset 0 1px 2px #888d91, inset 0 -1px 1px #565a5d, inset 1px 0 1px #565a5d, inset -1px 0 1px #565a5d, 0 1px 1px #63676a; -moz-box-shadow: inset 0 1px 2px #888d91, inset 0 -1px 1px #565a5d, inset 1px 0 1px #565a5d, inset -1px 0 1px #565a5d, 0 1px 1px #63676a; box-shadow: inset 0 1px 2px #888d91, inset 0 -1px 1px #565a5d, inset 1px 0 1px #565a5d, inset -1px 0 1px #565a5d, 0 1px 1px #63676a; }
  .pretty.navbar a.toggle i { text-shadow: 0 1px 1px #191a1b; }
  .pretty.navbar a.toggle:hover { background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #888d91), color-stop(100%, #565a5d)); background-image: -webkit-linear-gradient(#888d91, #565a5d); background-image: -moz-linear-gradient(#888d91, #565a5d); background-image: -o-linear-gradient(#888d91, #565a5d); background-image: linear-gradient(#888d91, #565a5d); }
  .pretty.navbar a.toggle:active, .pretty.navbar a.toggle.active { background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #3e4043), color-stop(100%, #4a4d50)); background-image: -webkit-linear-gradient(#3e4043, #4a4d50); background-image: -moz-linear-gradient(#3e4043, #4a4d50); background-image: -o-linear-gradient(#3e4043, #4a4d50); background-image: linear-gradient(#3e4043, #4a4d50); -webkit-box-shadow: 0 1px 1px #63676a; -moz-box-shadow: 0 1px 1px #63676a; box-shadow: 0 1px 1px #63676a; } }
.pretty.navbar.row { border-radius: 4px; }
@media only screen and (max-width: 767px) { .pretty.navbar.row { -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } }
.pretty.navbar ul li.field input.search { background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #191a1b), color-stop(100%, #4f5255)); background-image: -webkit-linear-gradient(#191a1b, #4f5255); background-image: -moz-linear-gradient(#191a1b, #4f5255); background-image: -o-linear-gradient(#191a1b, #4f5255); background-image: linear-gradient(#191a1b, #4f5255); border: none; box-shadow: 0 1px 2px #888d91 !important; /* Remove this line if you dont want a dropshadow on your navigation*/ }
.pretty.navbar > ul > li:first-child, .pretty.navbar .pretty.navbar > ul > li:first-child a:hover { box-shadow: none; }

.navbar li .dropdown ul { margin: 0; display: block; }
.navbar li .dropdown ul > li { position: relative; display: block; width: 100%; float: left; text-align: left; height: auto; border-radius: none; }
@media only screen and (min-width: 768px) and (max-width: 939px) { .navbar li .dropdown ul > li { max-width: 320px; word-wrap: break-word; } }
.navbar li .dropdown ul > li a { display: block; padding: 0 10px; color: #5888c1; border-bottom: 1px solid #cccccc; text-shadow: none; height: 26px; line-height: 27px; font-size:17px;/* Taille caractères dans les sous-menus */}
@media only screen and (max-width: 767px) { .navbar li .dropdown ul > li a { padding: 0 20px; } }
.navbar li .dropdown ul > li .dropdown { display: none; background: white; }
.navbar li .dropdown ul > li:hover .dropdown { border-top: none; display: block; position: absolute; z-index: 9999; left: 320px; top: 0px; margin-top: 0; }
@media only screen and (max-width: 767px) { .navbar li .dropdown ul > li:hover .dropdown { position: relative; left: 0; }
  .navbar li .dropdown ul > li:hover .dropdown ul { background: #252728 !important; } }
.navbar li .dropdown ul li:first-child a { border-radius: 0; }
.navbar li .dropdown ul li a:hover { background: #f2f2f2; }

.subnav { display: block; width: auto; overflow: hidden; margin: 0 0 18px 0; padding-top: 4px; }
.subnav li, .subnav dt, .subnav dd { float: left; display: inline; margin-left: 9px; margin-bottom: 4px; }
.subnav li:first-child, .subnav dt:first-child, .subnav dd:first-child { margin-left: 0; }
.subnav dt { color: #999; font-weight: normal; }
.subnav li a, .subnav dd a { color: #05390a; font-size: 15px; text-decoration: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
.subnav li.active a, .subnav dd.active a { background: #5dbb73; padding: 5px 9px; text-shadow: 0 1px 1px #77d58e; }

.drawer { position: relative; width: 100%; max-height: 0; background: #222; -webkit-box-shadow: inset 0 -3px 5px black, inset 0 3px 5px black; box-shadow: inset 0 -3px 5px black, inset 0 3px 5px black; overflow: hidden; -webkit-transition-duration: .3s; /* Saf3.2+, Chrome */ -moz-transition-duration: .3s; /* FF4+ */ -ms-transition-duration: .3s; /* IE10 */ -o-transition-duration: .3s; /* Opera 10.5+ */ transition-duration: .3s; }
.drawer.active { height: auto; max-height: 800px; -webkit-transition-duration: .5s; /* Saf3.2+, Chrome */ -moz-transition-duration: .5s; /* FF4+ */ -ms-transition-duration: .5s; /* IE10 */ -o-transition-duration: .5s; /* Opera 10.5+ */ transition-duration: .5s; }


/* ======== MY OWN ========= */
	html, body {
		background: url('img/bg.jpg') repeat;
		font-family: Arial;
	}

	.column, .columns, .tiles > li {
	}
	#video_stuff {
	
		border-radius:5px 5px 0 0;
	}

	.row {
		text-align: center;
	}
	.row p {font-family: Arial;}

	h1, h2 {
		font: bold 50px Arial;
		letter-spacing: -.05em;
		-webkit-transition-duration: 1s;
	}

	h2  {
		font-size: 21px;
		font-weight: normal;
		line-height: 1.6;
	}

	p {
		font-size: 16px;
		line-height: 60px;
		margin-bottom: 0;
		color: #555;

		-webkit-transition-duration: .2s;
		-moz-transition-duration: .2s;
		-o-transition-duration: .2s;
		-ms-transition-duration: .2s;
		transition-duration: .2s;
	}

	.column:hover p, .columns:hover p {
		font-size: 25px;
		font-weight: bold;

		-webkit-transition-duration: .2s;
		-moz-transition-duration: .2s;
		-o-transition-duration: .2s;
		-ms-transition-duration: .2s;
		transition-duration: .2s;
	}

	.head, .head:hover {
		box-shadow: none;
		margin-top: 30px;
	}

	.head span {
		font-weight: bold;
		color: #353535;
	}

	.head span span {
		font-size: 32px;
		font-weight: bold !important;
	}

	a {
		color: #5888c1;
	}

	a:hover {
		text-decoration:none;
		color:#d04526;
	}

	.special, .special:hover {
		background: transparent;
        border: none;
	}

	.special:hover p {
		color: #ffe400;
	}
  .container {margin-top:70px;position:relative;}	
  #titre {margin-top:-40px;height:50px;text-align:left;color:#5888c1;letter-spacing: -.01em;-webkit-transition-duration: 1s;font: bold 30px Arial;}
  #stitre {margin-top:5px;background:#000;border-radius:5px 5px 0 0;padding-left:5px;}
  #stitre h2 {color:#fff;text-align:left;padding-left:15px;}
  .logo {background:#fff;border:none;margin:0;height:120px;border-radius:5px 5px 0 0;margin-bottom:-1px;}
  .menu1 {background:transparent;border:none;}
  #videoplayer {width:940px;height:550px;border-radius:5px;margin-bottom:20px;}
  #nav1{background:#ffffff;padding-top:14px;border:none;}
  .four{background: #ffffff repeat;}
  #mobile{display:none;position:relative;}
  #logos a {display:inline;}
  #texte{text-align:justify;margin-bottom:20px;}
  #auteur1{text-align:justify;float:left;width:12%;}
  #auteur2{text-align:justify;float:left;width:88%;}
  .footer{text-align:justify;}
  @media screen and (min-width: 768px) and (max-width: 991px)  {
	#videoplayer {width:740px;height:396px;border-radius:0 0 5px 5px;}  
	#mobile{display:none;}  
  }
  @media only screen and (max-width: 767px) {
	.navbar {height:200px;}
	#mobile{display:block;}
	#screen{display:none;}
	h1 {font: bold italic 30px georgia, times new roman, serif; -webkit-transition-duration: .5s;}
	h2 {font-size: 31px; color:#5b8ac2;}
	#titre {height:30px;}
	.marker{color:#fff1af;}
	#titre, #titre1, #titre2 {font: bold 25px Arial;text-align:left;margin-left:0px;margin-top:-15px;}
	#videoplayer {display:none;	}
	#liste{margin:20px 20px 20px 0;border-radius:5px;}
	#liste ul {margin:0px;}
	#liste2{margin:20px 20px 20px 0;border-radius:5px;}
	.li-liste{padding-left:20px;}
	#ttr1{color:#5b8ac2;font-size:22px;font-weight:bold;margin-bottom:-10px;}
	#ttr2{color:#2a8e2a;font-size:22px;font-weight:bold;margin-bottom:-10px;}
	.ul-liste{margin-top:20px;font-size:18px;font-weight:normal;background-color:#5b8ac2;}
	.ul-liste li{padding:10px;border-radius:5px 5px 0 0;border-bottom:2px solid #ffffff;}
	.ul-ssliste{background:url('img/bg-liste.jpg') #ffffff bottom repeat-x;}
	.ul-ssliste li{padding:8px 10px 8px 10px;margin:0;border:none;}
	.ul-liste li a {color:#fff;}
	.footer{background:#5d5d5d;}
	.footer, .footer a {color:#ffffff;font-size:12px;}
  }