   /* 00.generic.css */


/* Web Fonts 
@font-face {
    font-family: 'font-regular';
    src: url('font/proxima_nova_regular-webfont.eot');
    src: url('font/proxima_nova_regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/proxima_nova_regular-webfont.woff') format('woff'),
         url('font/proxima_nova_regular-webfont.ttf') format('truetype'),
         url('font/proxima_nova_regular-webfont.svg#robotothin') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'font-light';
    src: url('font/proxima_nova_light-webfont.eot');
    src: url('font/proxima_nova_light-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/proxima_nova_light-webfont.woff') format('woff'),
         url('font/proxima_nova_light-webfont.ttf') format('truetype'),
         url('font/proxima_nova_light-webfont.svg#robotolight') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'font-bold';
    src: url('font/proxima_nova_bold-webfont.eot');
    src: url('font/proxima_nova_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/proxima_nova_bold-webfont.woff') format('woff'),
         url('font/proxima_nova_bold-webfont.ttf') format('truetype'),
         url('font/proxima_nova_bold-webfont.svg#robotobold') format('svg');
    font-weight: normal;
    font-style: normal;
} */

/* Generic */
* { color:#FFF; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight-color:transparent; font-weight:normal; line-height:125%; border:0; margin:0; padding:0; font-size:13px; font-family: Arial, sans-serif; text-decoration:none; }
html, body { height:101%; margin:0; padding:0; }
::selection { background:#EEE; } ::-moz-selection { background:#EEE; }
p { padding:0 0 15px 0; color:inherit; }
b, strong, .bold { font-weight:bold; color:inherit; font-size:inherit; }
ul { margin:0 0 15px 16px; color:inherit; }
li { padding-bottom:5px; color:inherit; }
span, div { color:inherit; font-size:inherit; }
.upper { text-transform:uppercase; }
.center { text-align:center; }
.line-height-off { line-height:1; }

/* Heading */
h1 { font-size:28px; color:#FFF; }
h2 { font-size:14px; color:#FFF; margin-bottom:3px; }
h3 { font-size:20px; margin-bottom:8px; text-transform:uppercase; }

/* Link */
a { color:#FFF; text-decoration:underline; font-weight:bold; }
a:hover { color:#E11F26; }
.link-dark a { color:#333; text-decoration:none; font-weight:bold; }
.link-dark a:hover { color:#E11F26; }
.link-light a { color:#FFF; text-decoration:none; font-weight:bold; }
.link-light a:hover { color:#E11F26; }
.link-high a { color:#E11F26; text-decoration:none; font-weight:bold; }
.link-high a:hover { color:#333; }
.link-opacity { opacity:1; }
.link-opacity:hover { opacity:0.7; }

.button { display:inline-block; padding:8px 15px 7px 15px; background-color:#2B2B2B; color:#FFF; font-weight:bold; font-size:16px; text-decoration:none; text-transform:uppercase; }
.button:hover { background-color:#FFF; color:#333; }
.button-high { display:inline-block; padding:8px 15px 7px 15px; background-color:#E11F26; color:#FFF; font-weight:bold; font-size:16px; text-decoration:none; text-transform:uppercase; }
.button-high:hover { background-color:#FFF; color:#333; }
.button-light { display:inline-block; padding:8px 15px 7px 15px; border:1px solid #FFF; color:#FFF; font-weight:bold; font-size:16px; text-decoration:none; text-transform:uppercase; }
.button-light:hover { background-color:#E11F26; border:1px solid #E11F26; color:#FFF; }

/* Navigation */
#nav-spacer { height:0; background-color:#333; }
#nav { width:100%; background:url('files/2/nav-back_2015-05-13-10-42.png') repeat 0 0; height:60px; position:fixed !important; left:0; top:0; z-index:150; }
.logo { float:left; display:block; height:60px; margin:0; opacity:0.5; border-right:1px solid #676767; }
.logo.selected, .logo:hover { opacity:1; }
#nav-main { float:right; }
#nav-buttons { float:left; display:block; padding-left:15px; }
#nav-buttons a { display:block; float:left; font-weight:normal; color:#FFF; font-size:14px; height:37px; background-color:transparent; margin:23px 15px 0 15px; cursor:pointer; text-transform:uppercase; text-decoration:none; }
#nav-buttons a.selected, #nav-buttons a.selected:hover { background:url('files/2/nav-but-selected_2015-05-20-12-17.png') repeat-x center 20px; background-color:transparent; color:#FFF; }
#nav-buttons a:hover { background-color:transparent; color:#E11F26; }
#nav-buttons.close { display:block; }
#but-mobile { display:none; float:right; width:62px; height:60px; cursor:pointer; background:url('files/2/nav-mobile_2015-05-13-10-44.png') no-repeat 0 4px; }
@media all and (max-width: 980px) {
    #but-mobile { display:block; }
    #nav-buttons { width:100%; float:none; position:absolute; top:60px; left:-15px; background-color:#2B2B2B; }
    #nav-buttons a { float:none; border-top:1px solid #4D4D4D; height:31px; padding:15px 15px 0 15px; text-align:center; margin:0; }
    #nav-buttons a:last-child { border-bottom:1px solid #4D4D4D; }
  	#nav-buttons a:hover { background-color:#2B2B2B; color:#E11F26; }
  	#nav-buttons a.selected, #nav-buttons a.selected:hover { color:#FFF; background:none; background-color:#E11F26;; color:#FFF; }
  	#nav-buttons.close { display:none; }
}

/* Background */
.bg-light { background-color:#FFF; color:#2B2B2B; }
.bg-dark { background-color:#2B2B2B; color:#FFF; }
.bg-darklight { background-color:#58595B; color:#FFF; }
.bg-high { background-color:#E11F26; color:#FFF; }
.bg-low { background-color:#F1F2F2; color:#2B2B2B; }

/* Text */
.txt-dark { color:#222; }
.txt-light { color:#FFF; }
.txt-high { color:#E11F26; }

/* Custom */
.line-dark { margin:15px auto 30px auto; width:70px; height:5px; background-color:#000; clear:both; float:none; }
.line-light { margin:15px auto 30px auto; width:70px; height:5px; background-color:#FFF; clear:both; float:none; }
.line-light-big { margin:15px auto 30px auto; width:120px; height:8px; background-color:#FFF; clear:both; float:none; }
.line-high { margin:15px auto 30px auto; width:70px; height:5px; background-color:#E11F26; clear:both; float:none; }

#FoodMenu { color:#222; }
#FoodMenu h2 { display:table; color:#222; font-size:24px; font-weight:bold; padding:0 0 5px 0; margin:30px 0; border-bottom:5px solid #E11F26; text-transform:uppercase; }
#FoodMenu h3 { color:#222; }
#FoodMenu strong { color:#222; }
#FoodMenu u { color:#E11F26; text-decoration:none; font-weight:bold; }
#FoodMenu hr { border-bottom:1px solid #BBB; margin:10px 0; }
.panel-close > div > div { background:url('files/2/btn-menu_open_2015-06-16-12-00.png') no-repeat right center; }
.panel-open > div > div { background:url('files/2/btn-menu_close_bistroV_2015-06-16-12-00.png') no-repeat right center; }

/* Responsive */
.slice > div { text-align:center; }
.slice.full-height { height:100%; -webkit-transition: height .50s ease-in; -moz-transition: height .50s ease-in; -o-transition: height .50s ease-in; transition: height .50s ease-in;} /* Javascript driven */
.slice.valign-middle { width:100%; display:table; }
.slice.valign-middle > div { width:100%; display:table-cell; text-align:center; vertical-align:middle; }

@media all and (max-width: 600px) {
  #platform:before { content:'MOBILE'; }
  .mobile-hidden { display:none; }
  
  .logo { border: 0; }
	.slice > div { padding:0 25px; }
  .padding { padding-top:50px; padding-bottom:50px; }
  .padding-top { padding-top:50px; }
  .padding-bottom { padding-bottom:50px; }
	
  .slice-tiles { width:100%; margin:0; }
	.slice-tiles.rows-2 > div { width:100%; margin:0; }
  .slice-tiles.rows-3 > div { width:100%; margin:0; }
  .slice-tiles.rows-4 > div { width:100%; margin:0; }
  .slice-tiles.rows-5 > div { width:100%; margin:0; }
  .slice-tiles.rows-6 > div { width:100%; margin:0; }
    .slice-tiles > div.row-100pc { width:100%; }         
    .slice-tiles > div.row-66pc { width:66.66%; }           
    .slice-tiles > div.row-33pc { width:33.33%; } 
  
  .text-1x { font-size:14px; }
  .text-2x { font-size:20px; }
  .text-3x { font-size:28px; }
  .text-4x { font-size:35px; }
  .text-5x { font-size:36px; }
  
  .youtube { height:255px; }
  .bg-fixed { background:url('files/2/bistroV_background dark_2015-05-15-14-58.jpg') no-repeat center center; }
}
@media all and (min-width: 601px) and (max-width: 950px) {
	/* Tablette */
  #platform:before { content:'TABLETTE'; }
  .mobile-show, #nav-buttons a.mobile-show { display:none; }
  
	.slice > div { padding:0 15px; margin:0 auto; width:570px; }
  .padding { padding-top:50px; padding-bottom:50px; }
  .padding-top { padding-top:50px; }
  .padding-bottom { padding-bottom:50px; }
  
  .slice-tiles { margin:0 auto; width:600px; }
  .slice-tiles.full { width:100%; }
  .slice-tiles.rows-2 > div { float:left; width:50%; }      
  .slice-tiles.rows-3 > div { float:left; width:50%; }       
  	
  .slice-tiles.rows-4 > div { float:left; width:50%; }       
  .slice-tiles.rows-5 > div { float:left; width:33.33%; }     
  .slice-tiles.rows-6 > div { float:left; width:33.33%; }
    .slice-tiles > div.row-100pc { width:100%; }         
    .slice-tiles > div.row-66pc { width:66.66%; }           
    .slice-tiles > div.row-33pc { width:33.33%; } 
  	.slice-tiles > div:last-child { float:none; clear:both; width:auto; }
 
  .text-1x { font-size:16px; }
  .text-2x { font-size:24px; }
  .text-3x { font-size:30px; }
  .text-4x { font-size:50px; }
  .text-5x { font-size:60px; }
  
  .youtube { height:275px; }
  .bg-fixed { background:url('files/2/bistroV_background dark_2015-05-15-14-58.jpg') no-repeat center center; }
}
@media all and (min-width: 951px) {
	/* Desktop */
  #platform:before { content:"DESKTOP"; }
  .mobile-show, #nav-buttons a.mobile-show { display:none; }
  
	.slice > div { padding:0 15px; margin:0 auto; width:870px; }
	.padding { padding-top:50px; padding-bottom:50px; }
  .padding-top { padding-top:50px; }
  .padding-bottom { padding-bottom:50px; }
  
  .slice-tiles { margin:0 auto; width:900px; }
  .slice-tiles.full { width:100%; }
  .slice-tiles.rows-2 > div { float:left; width:50%; }        
  .slice-tiles.rows-3 > div { float:left; width:33.33%; }                    
  .slice-tiles.rows-4 > div { float:left; width:25%; }                      
  .slice-tiles.rows-5 > div { float:left; width:20%; }                      
  .slice-tiles.rows-6 > div { float:left; width:16.6%; }
    .slice-tiles > div.row-100pc { width:100%; }         
    .slice-tiles > div.row-66pc { width:66.66%; }           
    .slice-tiles > div.row-33pc { width:33.33%; }  
	  .slice-tiles > div:last-child { float:none; clear:both; width:auto; }
  
  .text-1x { font-size:16px; }
  .text-2x { font-size:24px; }
  .text-3x { font-size:34px; }
  .text-4x { font-size:50px; }
  .text-5x { font-size:60px; }
  
  .youtube { height:400px; }
}

/* Contact */
#contact div { }
.contact-label { color:#FFF; font-size:14px; }
#contact input, 
#contact select, 
#contact textarea { width:95%; padding:3px; margin:4px 0 10px 0; background-color:#333; color:#FFF; border:1px solid #888; font-size:14px; }
#contact textarea { width:95%; height:80px; }
#contact option { color:#000; }
#contact-button { font-weight:bold; cursor:pointer; display:table-cell; padding:6px 10px 5px 10px; background-color:#E11F26; color:#FFF; font-size:16px; }
#contact-button:hover { background-color:#FFF; color:#333; }

/* Mailing */
#mailing { }
#mailing-quote { font-size:20px; margin-bottom:8px; color:#FFF; text-transform:uppercase; }
#mailing-email { width:95%; padding:3px; margin:0 0 10px 0; background-color:#333; color:#FFF; border:1px solid #888; font-size:14px; }
#mailing-email:focus { color:#FFF; }
#mailing-button { font-weight:bold; cursor:pointer; display:table-cell; padding:6px 10px 5px 10px; background-color:#E11F26; color:#FFF; font-size:16px; text-transform:uppercase; }
#mailing-button:hover { background-color:#FFF; color:#333; }


