/* HTML5 ✰ Boilerplate
 * ==|== normalize ==========================================================
 */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 13px; line-height: 1.231; }
body, button, input, select, textarea { font-family: sans-serif; color: #222; }

::-moz-selection { background: #EE3F3E; color: #fff; text-shadow: none; }
::selection { background: #EE3F3E; color: #fff; text-shadow: none; }

a { color: #00e; }
a:hover { color: #06e; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }
table button, table input { *overflow: auto; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }


/* ==|== font import @font-face ===================================================== */





/* ==|== primary styles =====================================================
   Author: 
   ========================================================================== */


body {
	padding: 0;
	background: url(/img/layout/bg.jpg) repeat top center;
	font-size: 14px;
}
.saloon body {color: #fff;}

.wrap {width: 1020px; margin: 0 auto;}
.inner {width: 900px; margin: 0 auto;}

.clickable {cursor: pointer;}

.border {border: 10px solid #000;}
  .saloon .border {border: 10px solid #8b181b;}


#main #container .col2tier a {font-weight:bold; text-decoration:underline; color: #000;}
  .saloon #main #container .col2tier a {color: #fff; text-decoration: underline;}
  #main #container .col2tier a:hover {}

/*********************************/
/************ HEADER *************/
/*********************************/
header {}

header #top {background-color: #000; color: #fff; padding: 10px 0;}
header #top .desc {float:left;}
header #top .desc a { color: white; text-decoration: none; font-weight: bold; text-transform: uppercase;}
header #top nav.top {float:right;}
header #top nav.top ul {}
header #top nav.top ul li {float:left; margin-left: 40px;}
header #top nav.top ul li a {text-transform:uppercase; text-decoration:none; color: #fff;}
header #top nav.top ul li a:hover {}
header #top nav.top ul li a.facebook {background: url(/img/layout/ico-facebook.png) no-repeat left center; padding-left:30px;}

header #panel {background: url(/img/layout/bg-header.png) no-repeat; width: 960px; height: 276px; padding: 30px; text-align:center; position:relative;}
  .saloon header #panel {background-image: url(/img/layout/bg-header-black.png);}
header #panel .location {font-size:9px; text-transform: uppercase; margin: 15px 0;}
header #panel .location .separ {margin: 0 55px; font-size:30px; vertical-align:-6px; color: #969696;}
header #panel #logo {}
  .saloon header #panel #logo {position:relative; top:-55px;}
header #panel .coordonnees {text-transform:uppercase; margin: 15px 0; position: absolute; width: 965px; bottom: 25px;}
  .saloon header #panel .coordonnees {}
header #panel .coordonnees .address {font-size: 11px;}
header #panel .coordonnees .separ {margin: 0 20px; font-size:30px; vertical-align:-6px; color: #969696;}
header #panel .coordonnees .tel {font-size:15px;}

header nav.main {margin: 0 30px; box-shadow: 0px 2px 10px #888888; position:relative;}
header nav.main ul {border-top: 1px solid #fff; border-bottom: 1px solid #fff;}
header nav.main ul li {float:left;}
header nav.main ul li a {width: 180px; padding: 5px; border: 1px solid #fff; background-color: #000; color: #fff; display:block; text-align: center; font-size:18px; font-weight: bold; text-transform: uppercase; text-decoration:none;}
  .saloon header nav.main ul li a {background-color: #8b181b;}
header nav.main ul li a .mini {display:block; font-size: 11px; font-weight:bold; font-style:italic;}
header nav.main ul li.active a,
header nav.main ul li a:hover {background-color: #fff; color: #000;}
header nav.main ul li.sans-mini a {padding-top: 11px; padding-bottom: 12px;
}


/*********************************/
/************ FOOTER *************/
/*********************************/
footer {background-color: #000; color: #fff; padding: 20px 0 30px 0;}
footer nav.footer {margin-bottom: 10px;}
footer nav.footer ul {}
footer nav.footer ul li {float:left; padding-right: 10px; border-right: 1px solid #fff; margin-right: 10px;}
footer nav.footer ul li a {text-transform: uppercase; color: #fff; text-decoration: none;}
footer .credits {font-size:11px; color: #aaa;}


/*********************************/
/************ CONTENT ************/
/*********************************/
#main {}

#main h1 {font-size: 28px; font-weight:bold; text-transform: uppercase;}
#main h1 .mini {font-size: 15px; display:block;}
#main h2 {font-size: 23px; font-weight: bold;}
#main h2.event {text-transform:uppercase;}
#main h3 {font-size: 13px; font-weight:bold; font-style: italic;}
#main a.plus {font-size: 11px; font-weight:bold; font-style:italic; text-decoration:underline; color: #969696;}
  .saloon #main a.plus {color: #fff;}
#main a.plus2 {font-size: 14px; font-style:italic; display:block; text-align:center; color: #969696; padding: 4px; border-top: 1px solid #969696; border-bottom: 1px solid #969696; text-decoration:none;}
  .saloon #main a.plus2 {color: #fff;}


#main #container {background: url(/img/layout/bg-content.jpg) repeat-x bottom left #fff; width: 920px; margin: 0 auto; padding: 40px 20px;}
  .saloon #main #container {background-color: #000; background-image: none;}
#main #container .col {float:left; margin: 0 15px;}
#main #container .col2tier {width: 560px;}
#main #container .col1tier {width: 300px;}

#main ul#installations {list-style:none; margin:0; padding:0;}
#main ul#installations li {position: relative; background: url(/img/layout/bg-tiket.png) no-repeat; width: 504px; padding: 22px 40px; margin-left: -25px;}
  .saloon #main ul#installations li {background-image: url(/img/layout/bg-tiket-red.png);}
#main ul#installations li img {float:left; margin-right: 20px;}
#main ul#installations li .desc {float:left; width: 260px;}
#main ul#installations li .desc h2 {margin-top:0; margin-bottom: 5px;}
#main ul#installations li .desc p {margin: 5px 0;}
#main ul#installations li .desc a.plus {position:absolute; bottom: 20px; right: 45px;}


#main ul#evenements {list-style:none; margin:0 0 40px 0; padding:0;}
#main ul#evenements li {border-bottom: 1px solid #969696; padding-bottom: 15px;}
  #main ul#evenements.page li {width: 430px; margin-right:20px; float:left; position:relative; margin-bottom: 15px;}
#main ul#evenements li img {float:left; margin-right: 15px;}
#main ul#evenements li .desc {}
#main ul#evenements li .desc h3 {margin-bottom: 0;}
#main ul#evenements li .desc .endroit {font-size: 13px; font-style:italic;}
#main ul#evenements li .desc .date {font-size: 23px; font-weight:bold;}
#main ul#evenements li .desc .plus {}
  #main ul#evenements.page li .desc .plus {position:absolute; bottom:15px;}

#main #evenement {}
#main #evenement h1 {/*float:left;*/}
#main #evenement .desc {/*float:right; margin-top:21px; text-align:right;*/ margin:10px 0;}
#main #evenement .desc .endroit {display:inline-block; padding-right: 10px; border-right: 1px solid #969696; margin-right:10px;}
#main #evenement .desc .date {display:inline-block;}

#main #evenement #images {}
#main #evenement #images ul {margin:0; padding:0; list-style:none;}
#main #evenement #images ul li {float:left; margin:13px;}
#main #evenement #images ul li a {}

#main #slider {width: 540px; height: 354px; border: 10px solid #000; overflow:hidden; margin-bottom: 40px; position:relative;}
  .saloon #main #slider {border: 10px solid #8b181b;}
  #main #evenement #slider {height:308px;}
#main #slider.seize9 {width: 540px; height: 304px;}
#main #slider .nav {}
#main #slider .nav a.bt-back,
#main #slider .nav a.bt-next {position:absolute; top:145px; width: 45px; height: 61px; z-index: 9999;}
  #main #slider.seize9 .nav a.bt-back, #main #slider.seize9 .nav a.bt-next {top: 110px;}
  #main #evenement #slider .nav a.bt-back, #main #evenement #slider .nav a.bt-next  {top: 110px;}
#main #slider .nav a.bt-back {background-image: url(/img/layout/bt-back-black.png); left:-10px;}
  .saloon #main #slider .nav a.bt-back {background-image: url(/img/layout/bt-back-red.png);}
#main #slider .nav a.bt-next {background-image: url(/img/layout/bt-next-black.png); right:-10px;}
  .saloon #main #slider .nav a.bt-next {background-image: url(/img/layout/bt-next-red.png);}
#main #slider ul {list-style:none; margin:0; padding:0;}
#main #slider ul li {}
#main #slider ul li img {}

#main #contact {background-color: #969696; padding: 20px; margin-top: 20px;}
#main #contact p {margin-top:0; color: #fff;}
#main #contact #msg-err {margin-bottom: 20px; display: block; color: #fff; background-color: #000; padding: 5px; text-align: center; font-size: 13px;}
#main #contact #msg {}
#main #contact input, #main #contact textarea  {border:none; background-color: #fff; font-size: 13px; margin-bottom: 20px; padding: 5px;}
#main #contact input {width: 238px;}
#main #contact input.nom {margin-right: 20px;}
#main #contact textarea {width: 510px; height:100px;}
a.btn {background-color: #000; padding: 5px 15px; border: 2px solid #fff; color: #fff !important; text-decoration:none!important; text-transform: uppercase;}
a.btn:hover {background-color: #333;}





.ie7 header #panel .coordonnees {left:0;}
.ie7 #main ul#evenements li .desc {width:140px;margin-top:-5px;}
.ie7 #main ul#evenements li img {margin-top:10px;}

.ie7 #main ul#evenements.evenement-activites li img {margin-top:0px;}
.ie7 #main ul#evenements.evenement-activites li .desc {margin-top:0px;}

/* ==|== non-semantic helper classes ======================================== */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


/* ==|== media queries ====================================================== */

@media only screen and (min-width: 480px) {

}

@media only screen and (min-width: 768px) {

}



/* ==|== print styles ======================================================= */
 
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } 
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } 
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}