@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;500;700&display=swap');

html, body	{ margin:0; padding:0; }
html		{ overflow-y:scroll; }
body		{ font-size:80%; font-family:'Roboto', sans-serif; font-weight:300; }
a			{ outline:none; }
a img		{ border:none; }
strong		{ font-weight:500; }

#overlay					{ position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7); display:none; }


#content h1					{ font-weight:300; background:#990037; padding:15px 15px 10px 40px; margin:0; color:white; overflow:hidden; position:relative; font-size:20px; }
#content h1 .bottle			{ position:absolute; height:80px; left:-20px; top:5px; }
#content h1 .nb				{ font-size:10px; margin-left:50px; }
#content h1 .buttons		{ float:right; height:25px; margin-left:10px; margin-top:-2px; }
#content h1 .buttons:first-child		{ margin-left:20px; }

#content .filtres			{ display:table; width:100%; font-size:11px; background:#B20040; color:white; }
#content .filtres ul		{ display:table-row; list-style:none; margin:0; padding:0; text-align:center; }
#content .filtres li		{ display:table-cell; vertical-align:middle; text-align:center; padding:8px 0;line-height:10px; }
#content .filtres li.on		{ background-color:rgba(255,255,255,0.2); }

#content #filter_row2 li:nth-child(1)	{ width:16%; }
#content #filter_row2 li:nth-child(2)	{ width:20%; }
#content #filter_row2 li:nth-child(3)	{ width:10%; }
#content #filter_row2 li:nth-child(5),
#content #filter_row2 li:nth-child(6),
#content #filter_row2 li:nth-child(7)	{  }
#content #filter_row2 li span			{ margin-left:2px; }

#content .liste_vins					{ border-collapse:collapse; background:white; }
#content .liste_vins .vin>td			{ border-bottom:1px #E5E5E5 solid; padding:5px; vertical-align:top; }
#content .liste_vins .vin .mill 		{ vertical-align:top; padding-top:10px; }
#content .liste_vins .blanc .mill 		{ border-left:5px #D9E021 solid; }
#content .liste_vins .vieux .mill 		{ border-left:5px #D8C66C solid; }
#content .liste_vins .spec .mill 		{ border-left:5px #8CC63F solid; }
#content .liste_vins .rose .mill 		{ border-left:5px #FF7BAC solid; }
#content .liste_vins .rouge .mill 		{ border-left:5px #C1272D solid; }
#content .liste_vins .doux .mill 		{ border-left:5px #FBB03B solid; }
#content .liste_vins .petillant .mill	{ border-left:5px #736357 solid; }
#content .liste_vins .mill p			{ color:#B2B2B2; font-weight:300;font-size:11px; writing-mode: tb-rl; transform: rotate(-180deg); text-align:center; margin:0; }
#content .desc h2						{ margin:0; font-size:14px; font-weight:300; }
#content .desc h3						{ margin:0; font-size:13px; font-weight:700; }
#content .desc .sous-titre				{ margin:0; font-size:11px; }
#content .desc .offert					{ margin:25px 0 0; font-size:11px; font-style: italic; }
#content .desc img#edit					{ float:none; display:block; margin:0; padding:10px 10px 10px 0; opacity:0.7; }
#content .liste_vins .vin .bttles 		{ vertical-align:middle; font-size:10px; text-align:right; padding-right:10px; }
#content .liste_vins .vin .bttles td p	{ width:30px; margin:0; }
#content .bouteilles td strong			{ font-weight:300; }
#content .bouteilles td span			{ margin-left:2px; }

#content .histo 						{ padding:0px; background:white; min-height:calc(100vh - 49px); }
#content .histo .liste_vins				{ width:100%; font-size:10px; }
#content .histo .liste_vins th,			
#content .histo .liste_vins td			{ border-bottom:1px #E5E5E5 solid; padding:5px; vertical-align:top; }
#content .histo .liste_vins th			{ background-color:#c13366; color:white; font-weight:300; text-align:left; padding:10px 5px; }
#content .histo .liste_vins tr>*:nth-child(3),
#content .histo .liste_vins tr>*:nth-child(4),
#content .histo .liste_vins tr>*:nth-child(5) 	{ text-align:right; vertical-align:middle; }
#content .histo .desc h2						{ font-size:12px; }
#content .histo .desc h3						{ font-size:11px; }
#content .histo .desc .sous-titre				{ font-size:10px; }


#modal, #modal_form						{ position:absolute; width:80vw; height:80vh; margin:25px auto; background:white; top:50%; left:50%; margin-left:-40vw; margin-top:-40vh;
									box-shadow:0 0 5px rgba(0,0,0,1); display:block; }
									
#modal .vin_desc										{ padding:20px; font-family:'Roboto', sans-serif; font-weight:300; }
#modal .vin_desc img									{ float:right; max-width:40%; max-height:160px; margin-left:10px; margin-bottom:30px; }
#modal .vin_desc p.radio								{ clear:both; font-size:10px; }
#modal .vin_desc table									{ width:100%; text-align:right; border-collapse:collapse; margin-top:40px; font-size:10px; }
#modal .vin_desc table th								{ font-weight:300; white-space:nowrap; }
#modal .vin_desc table tr:first-child th				{ border-bottom:1px #E5E5E5 solid; padding:5px 0 10px 0; }
#modal .vin_desc table tr:first-child th:first-child	{ text-align:right; padding-right:2px; }
#modal .vin_desc table tr:last-child th,
#modal .vin_desc table tr:last-child td					{ border-top:1px #E5E5E5 solid; }
#modal .vin_desc table tr:first-child th span			{ margin-left:2px; }
#modal .vin_desc table th:first-child					{ text-align:left; border-right:1px #E5E5E5 solid; }
#modal .vin_desc table td,
#modal .vin_desc table th								{ padding:10px 0 10px 0; width:20%; }
#modal .vin_desc table td:last-child,
#modal .vin_desc table th:last-child					{ padding-right:0; }
#modal .vin_desc table th input[type="checkbox"]		{ margin:0 2px 0 10px; top:3px; position:relative; }
#modal .vin_desc table td select						{ border:none; font-size:10px; appearance:none; background:transparent url(/img/arrows.svg) right no-repeat; 
															padding-right:15px; outline:none; }
#modal .vin_desc table th input[type='text']			
#modal .vin_desc p										{ margin:0 0 10px 0; }
#modal .vin_desc p.addMill								{ font-size:10px; margin-top:15px; }
#modal .vin_desc p.addMill input[type='text']			{ width:50px; padding:3px; border:1px #E5E5E5 solid; font-size:10px; margin-left:5px; }
#modal .vin_desc p.addMill input[type='submit']			{ background:#990037; border:none; padding:4px; border-radius:5px; color:white; width:50px; margin-left:5px; font-size:10px; }

#modal_form form							{ padding:10px 20px; }

#modal_form form>h2							{ font-size:18px; font-weight:300; text-align:center; margin:15px 0; }
#modal_form form .or						{ font-size:15px; font-weight:300; font-style:italic; text-align:center; border-bottom:1px solid lightgray; margin:0px 0 29px; }
#modal_form form .or span					{ background:white; top:8px; position:relative; padding:0 10px; }
#modal_form form #add-part					{ display:none; }

#modal_form form #vin-autocomplete			{ width:95%; background: none !important; margin:0 auto; display:block; }
#__lpform_vin-autocomplete img				{ display:none; }
.ui-menu .ui-menu-item						{ border-bottom:1px solid lightgray; }
.ui-menu .ui-menu-item span					{ display:block;font-family:'Roboto', sans-serif; font-weight:300; }
.ui-menu .ui-menu-item span:nth-child(1)	{ font-size:14px; }
.ui-menu .ui-menu-item span:nth-child(2)	{ font-size:13px; font-weight:700; }
.ui-menu .ui-menu-item span:nth-child(3)	{ font-size:11px; }
#modal_form form .desc						{ margin:10px 0; }
#modal_form form .desc img					{ float:left; height:44px; margin-right:10px; }
#modal_form form .desc img[src='']			{ border-color:white; }

#modal_form form label						{ display:inline-block; width:80px; }
#modal_form form span.hint 					{ display:block; margin-left:80px; font-size:8px; margin-top:2px; }
#modal_form form input[type='text']			{ border:1px solid gray; width:calc(100% - 86px); }
#modal_form form select						{ border:1px solid gray; width:calc(100% - 86px); }
#modal_form form input[type='file']			{ font-size:8px; }
#modal_form form p.submit					{ text-align:center; margin-top:20px; }
#modal_form form input[type='submit']		{ background:#990037; border:none; padding:8px 0; border-radius:5px; color:white; width:80%; }
/*
#modal_form form label			{ display:block; font-size:10px; padding-left:3px; }
#modal_form form input			{ font-size:12px; border-color:white; border-style:solid; border-width:1px; width:100%; }
#modal_form form input:focus	{ border-color:#E5E5E5; }
*/

@media (min-width:800px) {
	body								{ background:#F2E7E7; }
	#content  							{ width:377px; height:615px; margin:20px auto; overflow:auto; }
	#content::-webkit-scrollbar			{ width:12px; }
	#content::-webkit-scrollbar-track	{ background:#F2E7E7; }
	#content::-webkit-scrollbar-thumb 	{ background-color:#D8CECE; border-radius:20px; border:4px solid #F2E7E7; }
	#modal, #modal_form					{ width:302px; height:492px; margin-left:-151px; margin-top:-246px;  }
}