@charset "UTF-8";
/*------------------------------ BASE ------------------------------*/
/*Elements base*/
html, body { height: 100%; }

@font-face {
    font-family: 'colaborate-regularregular';
    src: url('ColabReg-webfont.eot');
    src: url('ColabReg-webfont.eot?#iefix') format('embedded-opentype'),
         url('ColabReg-webfont.woff') format('woff'),
         url('ColabReg-webfont.ttf') format('truetype'),
         url('ColabReg-webfont.svg#colaborate-regularregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'colaboratelightregular';
    src: url('ColabLig-webfont.eot');
    src: url('ColabLig-webfont.eot?#iefix') format('embedded-opentype'),
         url('ColabLig-webfont.woff') format('woff'),
         url('ColabLig-webfont.ttf') format('truetype'),
         url('ColabLig-webfont.svg#colaboratelightregular') format('svg');
    font-weight: normal;
    font-style: normal;

}



@font-face {
    font-family: 'colaborate-thinregular';
    src: url('ColabThi-webfont.eot');
    src: url('ColabThi-webfont.eot?#iefix') format('embedded-opentype'),
         url('ColabThi-webfont.woff') format('woff'),
         url('ColabThi-webfont.ttf') format('truetype'),
         url('ColabThi-webfont.svg#colaborate-thinregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

body { position: relative; overflow: hidden; font-family: "Times New Roman", Times, serif; background: #191919; }

.clear { float: none; clear: both; }

.hack_inline_block { font-size: 1px; letter-spacing: -1px; }
.hack_inline_block > * { letter-spacing: normal; font-size: 16px; }

/*------------------------------ LAYOUT ------------------------------*/
.l_header { position: absolute; z-index: 2; width: 100%; height: 90px; }

.tier { position: relative; display: inline-block; overflow: hidden; }
.tier.left_window { left: -40px; }
.tier.right_window { right: -40px; }
.tier.middle { background: #191919; z-index: 10; }
.tier .bg_img { position: relative; z-index: -1; }

/*------------------------------ MODULES ------------------------------*/
.loader { position: fixed; z-index: 900; top: 0; left: 0; height: 100%; width: 100%; text-align: center; color: #ac8955; background: #191919; }
.loader span { display: inline-block; position: absolute; top: 50%; height: 20px; width: 98px; margin-left:-49px; margin-top: -10px; line-height: 20px; font-size: 12px; }
.loader img { display: inline-block; position: absolute; top: 50%;  margin-left:-45px; width: 90px; margin-top: -100px; }

/*Menu top dans middle*/
.container_menu_top { position: relative; z-index: 50; width: 100%; margin: 0 auto; height: 45px; }

.menu_top { list-style: none; padding: 0; }

.li_menu_top { display: inline-block; vertical-align: top; position: relative; width: 20%; height: 45px; padding-top: 15px; font-size: 16px; font-variant: small-caps; text-align: center; }
.li_menu_top:last-child:after{background:none}
.li_menu_top:after { content: ""; position: absolute; top: 0; right: 0; height: 100%; width: 1px; background: #717171; }
.li_menu_top a { display: block; position: relative; height: 100%; color: #fff; text-decoration: none;  font-size:14px;  font-family: 'colaboratelightregular'; }
.li_menu_top a span { display: block; position: relative; padding:0 15px }
.li_menu_top a:hover { color: #ac8955; }

/*logo top dans left*/
.logo_top { display: block; position: absolute; z-index: 10; top: 10%; left: 30%; width: 132px; height: 78px; }

/*middle*/
/*conteneur general*/
.container_middle { position: relative; z-index: 10; width: 95%; margin: 0 auto; text-align: center;}

/*photos lignes et logo*/
.content_middle { position: relative; text-align: center; margin-top: 100px; padding-bottom:60px  }

.logo_middle { display: inline-block; position: relative; z-index: 2; width: 120px; margin-top: 100px; text-align: center; }
.logo_middle.visible{opacity:1 !important; margin-top:50px}
.logo_middle img { display: block; width: 100%; }

.container_static .infos_middle{top:0}
.mCSB_inside > .mCSB_container{margin-right:0 !important}
.text .mCSB_inside > .mCSB_container{margin-right:30px !important}
.grid-item{width:calc(50% - 10px);  overflow:hidden}
.grid-item a{width:100%; display:block; height:100%; position:relative}
.grid-item span{width:100%; display:block; position:absolute;top:0; left:0; vertical-align:middle; text-align:center; color:#fff; height:calc(100% - 5px);background:rgba(255,255,255,0.2); opacity:0;transition:0.5s all ease}
.grid-item span:hover{opacity:1}
.grid-item img{width:100%;transition:all ease 0.5s; }
.grid-item img:hover{transform:scale(1.2)}

.lines_container { position: absolute; left: 50%; bottom: 0; width: 260px; margin-left: -130px; }

.photo_middle { display: inline-block; position: relative; top: -120px; z-index: 2; width: 250px; margin-top: 200px; text-align: center; transition: all 0.7s; -webkit-transition: all 0.5s; }
.photo_middle img { width: 100%; transition: all 0.7s; -webkit-transition: all 0.5s; }

/* partie titre et lien central*/
.infos_middle { text-align: center; position: relative; top: -120px; }
.infos_middle .title_middle { display: inline-block; position: relative; color: #fff; font-size: 22px; font-weight: lighter; letter-spacing: 3px; text-align: center; text-transform: uppercase; }
.infos_middle .title_middle:before { content: ""; position: absolute; top: -8px; width: 80px; height: 1px; background: #717171; }
.infos_middle .voir_plus { display: inline-block; position: relative; top: -15px; padding-left: 30px; color: #ac8955; font-size: 16px; text-decoration: none; }
.infos_middle .voir_plus:before { content: ""; position: absolute; top: 50%; left: 0; width: 20px; height: 1px; background: #ac8955; }

.container_menu_middle { position: relative; top: -120px; width: 100%; text-align: center; }

.btn_listing { display: block; position: absolute; right: 15%; height: 30px; text-decoration: none; color: #fff; font-style: italic; }
.btn_listing span { display: inline-block; vertical-align: top; height: 15px; }
.btn_listing span:last-child { width: 77px; margin-left: 5px; background: url(../img/icon-plus.png) no-repeat 0 5px; }

.title_menu_middle { display: inline-block; position: relative; top: 25px; color: #fff; font-style: italic; }

.menu_middle { position: relative; top: 20px; width: 100%; list-style: none; padding: 0; margin: 0; text-align: center; }
.menu_middle .puce { display: block; width: 7px; height: 6px; background: url(../img/sprite-nav.png) no-repeat right; }
.menu_middle .li_menu_middle { display: inline-block; width: 20px; }
.menu_middle .li_menu_middle a { text-decoration: none; color: #fff; display: block; width: 100%; height: 100%; }
.menu_middle .li_menu_middle a:hover .puce { background-position: left; }

/* partie fenetre qui slide ├á gauche*/
.wrapper_slider { position: absolute; top: 0; left: 0; height: 100%; width: 100%; color: #b8b8b8; }

.slide_window { background: url(../img/bg_slide.png); text-align: center; }
.slide_window .close { display: block; position: absolute; right: 130px; top: 50px; z-index: 5; color: #fff; text-decoration: none; padding-left: 30px; }
.slide_window .close:before { content: ""; position: absolute; top: 50%; left: 0; width: 20px; height: 1px; background: #fff; }
.slide_window .text {  display: block; position: absolute; top:50%; left:50%; margin-left:-37.5%; vertical-align: middle; max-height: 80%; text-align: justify; width: 75%; z-index: 2; font-size: 13px; letter-spacing: 0.05em; }
.slide_window h3 { margin: 7px 0 2px; }
.slide_window p, .slide_window em { margin: 0;    font-family: 'colaboratelightregular';}
.slide_window h2 { margin-bottom: 3px; position: relative; padding-left: 30px; }
.slide_window h2:before { content: ""; position: absolute; top: 50%; left: 0; width: 20px; height: 1px; background: #717171; }
.slide_window .text.vide { width: 0; height: 100%; }
.slide_window .text a{color:#dedede}
.slide_window.vide { background: none; }
.slide_window .tab_about {   font-family: 'colaboratelightregular'; display: block; vertical-align: middle; max-height: 80%; position:absolute; top:50%; width:75%; right:50%; margin-right:-37.5%}
.slide_window .raw { border-top: 1px solid #717171; text-align: left; padding: 10px; }
.slide_window .raw .title { display: block; margin-bottom: 5px; font-size: 16px; text-align: left; text-transform: uppercase; }

#zone-form{    font-family: 'colaboratelightregular'; margin-bottom:60px}
#zone-form p{font-size: 12px; text-align:left; color:#fff;padding-left:10px}
#zone-form h3 { font-size: 12px; text-align:left; color:#fff;padding-left:10px}
.form aside {  width:50%; float:left;  box-sizing: border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;; padding:10px;font-size:11px; }
.form label { display:block; padding:5px; font-size:11px; color:#fff }
.form input { display:block; padding:5px; width:100%;  box-sizing: border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; color:#252424 }
.form input[type="button"] { background:none; color:#fff ; border-radius:0; outline:none; padding:10px; border:1px solid #fff;  font-size:13px;}
.form select { display:block; padding:5px; width:100%;  box-sizing: border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; color:#252424 }
.form textarea { display:block; padding:5px; width:100%; height:236px;  box-sizing: border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;; resize:none; color:#252424 }
.form p { display:block; padding:5px; color:#fff; font-size: 12px;}
.form div { display:block; padding:5px }
#ajax img{float:none !important}
#ajax2{color:#fff;}
#ajax2.error{color:#7b091c}
#ajax2.success{color:#3ab71d}
#ajax2 i{margin-right:5px}
.form aside.w100{width:100%}
.line{font-size:9px; float:right; width:50%}

.fancybox-skin{background:none !important; -webkit-box-shadow:none !important; box-shadow:none !important}
.fancybox-close{top:22px !important; right:22px !important}
.mobile{display:none}
.menu-btn-responsive{display:none}

footer{position:fixed; bottom:0; width:100%;font-family: 'colaboratelightregular';  z-index:1000; background:#191919; color:#fff; height:50px;box-sizing:border-box; padding:10px; font-size:12px }
.left-footer{float:left; margin-top:8px}
.right-footer{float:right}
.right-footer a{color:#fff}

/*------------------------------ STATE ------------------------------*/
/*------------------------------ RESPONSIVE ------------------------------*/
@media screen and (max-width: 1400px) { .li_menu_top { font-size: 12px; }
  .logo_middle { margin-top: 80px; }
  .photo_middle { margin-top: 200px; } }
@media screen and (max-width: 1100px) { .li_menu_top { font-size: 11px; }
  .logo_middle { margin-top: 50px; }
  .photo_middle { margin-top: 150px; width: 150px; }
  .tab_about { font-size: 12px; }
  .tab_about .title { font-size: 14px; } }

@media screen and (max-width: 1024px)
{
	body{overflow:auto !important}
	.big_wrapper {width:100% !important; height:auto !important}
	.left_window,.right_window{max-width:0; max-height:0}
	.tier{width:100% !important; height:auto !important}
	.text-responsive { text-align: justify; z-index: 2; font-size: 13px; letter-spacing: 0.05em; color:#b8b8b8; margin-bottom:20px;}
	.infos_middle{padding:20px}
	.infos_middle .title_middle{font-size:18px}
	.text-responsive h3 { margin: 7px 0 2px; }
	.text-responsive p, .slide_window em { margin: 0; }
	.text-responsive h2 { margin-bottom: 3px; position: relative; padding-left: 30px; }
	.text-responsive h2:before { content: ""; position: absolute; top: 50%; left: 0; width: 20px; height: 1px; background: #717171; }
	.text-responsive a{color:#dedede}
	.mobile > div{max-height:none !important}
	.mobile{display:block}
	.wrapper_slider {max-height:0; max-width:0}
	.diapo-responsive{height:300px; width:100%; margin-top:20px; border-top:1px solid #717171;border-bottom:#717171 1px solid}
	.diapo-responsive img{height:100%}
	.container_middle{width:100%}
	.diapo-responsive{overflow:hidden}
	.logo_middle,.logo_middle.visible{margin-top:0; z-index:100; opacity:1 !important}
	.logo_middle img{margin-top:-100px}
	.infos_middle .voir_plus{display:none}
	.text-vins{padding:20px; margin-top:20px; margin-bottom:0}
	.lines_container{top:10px}
	.raw.first-raw{margin-top:10px}
	.raw { border-top: 1px solid #717171; text-align: left; padding: 10px 0}
	.raw .title { display: block; margin-bottom: 5px; font-size: 16px; text-align: left; text-transform: uppercase; }
	footer{position:relative}
}
@media screen and (max-width: 720px)
{
	footer{text-align:center}
	.left-footer,.right-footer{float:none; margin-top:0}
}
@media screen and (max-width: 520px)
{
	.form aside{width:100%}
}
@media screen and (max-width: 420px)
{
.grid-item{width:100%}
.menu_top{display:none}
.container_menu_top{height:auto}
.menu-btn-responsive{display:block; color:#fff; font-size:14px; cursor:pointer; padding-top:0; text-align:center;  font-family: 'colaboratelightregular'; padding-top:10px}
.li_menu_top{padding:0px 0; width:100%;height:auto}
.li_menu_top a{padding:20px 10px !important; height:auto}
.li_menu_top a span{top:0 !important; margin-left:0 !important}
	.menu-btn-responsive{display:block}
}
/*# sourceMappingURL=style.css.map */
