/*********************/
/* LIGNE D'UNE PIECE */
/*********************/

/* VERSION : 1.00 */

/* Ligne de la pièce */

.LignePart
{
	display:flex;
	flex-wrap:wrap;
	width:1140px;
	align-items:center;
	padding:20px 0px 20px 20px;
	border-top:1px dotted silver;
}

@media all and (max-width: 480px) /* Mobile */
{
    .LignePart
    {
		width:360px;
    }
}

/* Champs caché pour ID de la pièce */

.idPart
{
	display:none;
}

/* Image de la pièce */

.Image-Liste
{
	display:flex;
	width:130px;
	height:98px;
	background:#FFFFFF;
	cursor:pointer;
	transform: scale(1);
	transition: .3s ease-in-out;
}

@media all and (max-width: 480px) /* Mobile */
{
    .Image-Liste
    {
		width:147px;
		height:110px;
		margin:2px 0px 2px 2px;
    }
}

.Image-Liste:hover
{
	transform: scale(1.05);
}

/* Référence BL/LEGO de la pièce */

.cadre-codebl-fiche
{
	margin:0px 20px 0px 20px;
}

.RefPart-Liste
{
	width:130px;
	font-size:14px;  
	color:rgb(20,34,37);
	font-weight:bold;
	text-align:center;
}

@media all and (max-width: 480px) /* Mobile */
{
    .RefPart-Liste
    {
		font-size:9px;
    }
}

.RefPartRed-Liste
{
	width:130px;
	font-size:14px;  
	color:Red;
	font-weight:bold;
	text-align:center;
}

.TitreRefPart-Liste
{
	font-size:9px;
	font-weight:normal;
}

/* Cadre infos de la pièce */

.CadreInfosPart-Liste
{
	display:flex;
	flex-direction:column;
	justify-content:center;
	padding:0px 10px 0px 10px;
}

@media all and (max-width: 480px) /* Mobile */
{
    .CadreInfosPart-Liste
    {
		width:360px;
		padding:0px 0px 0px 0px;
    }
}

.NamePart-Liste
{
	display:flex;
	width:800px;
	flex-wrap:wrap;
	font-size:15px;
	color:rgb(20,34,37);
	font-style:italic;
}

@media all and (max-width: 800px) /* Tablette */
{
    .NamePart-Liste
	{
		width:300px;
		margin:0px 5px 0px 5px;
	}
}

@media all and (max-width: 480px) /* Mobile */
{
    .NamePart-Liste
	{
		width:350px;
		margin:0px 5px 0px 5px;
	}
}

/* Dans x minifigs / animaux / sets */

.cadreNbFigAniSet
{
	display:flex;
	justify-content:flex-start;
	margin:10px 0px 0px 0px;
}

@media all and (max-width: 480px) /* Mobile */
{
    .cadreNbFigAniSet
    {
		flex-direction:column;
		margin:10px 0px 10px 0px;
    }
}

.boutonChoix
{
	background:white;
	display:flex;
	align-items:center;
	margin:2px 10px 2px 0px;
	padding:0px 8px 0px 8px;
	border:2px solid white;
	border-radius:10px;
	box-shadow:1px 1px 1px white;
	cursor:pointer;
	font-size:14px;
	color:rgb(20,34,37);
	text-shadow:0px 0px 0px rgb(20,34,37);
	font-weight:normal;
	text-align:center;
}

@media all and (max-width: 480px) /* Mobile */
{
	.boutonChoix
    {
		width:320px;
		height:35px;
		margin:2px 0px 2px 0px;
		font-size:20px;
    }
}

.boutonChoix:hover
{
	border:2px solid rgb(20,34,37);
	box-shadow:1px 1px 1px gray;
}

.boutonChoixOff
{
	background:white;
	display:flex;
	align-items:center;
	margin:2px 10px 2px 0px;
	padding:0px 8px 0px 8px;
	border:2px solid white;
	border-radius:10px;
	box-shadow:1px 1px 1px white;
	opacity:0.5;
	font-size:14px;
	color:gray;
	text-shadow:0px 0px 0px rgb(20,34,37);
	font-weight:normal;
	text-align:center;
}

@media all and (max-width: 480px) /* Mobile */
{
	.boutonChoixOff
    {
		width:320px;
		height:35px;
		margin:2px 0px 2px 0px;
		font-size:20px;
    }
}

.image-bouton-choix
{
	margin:0px 5px 0px 0px;
}

@media all and (max-width: 480px) /* Mobile */
{
	.image-bouton-choix
    {
		width:40px;
		height:40px;
		margin:0px 20px 0px 0px;
    }
}

.nbElement
{
	color:orange;
}

/* Zone avec les liens */

.ZoneLiens-Liste
{
	display:flex;
	margin:10px 0px 0px 0px;
}

@media all and (max-width: 480px) /* Mobile */
{
    .ZoneLiens-Liste
	{
		width:350px;
		margin:0px 5px 0px 5px;
	}
}

.Lien-Liste
{
	margin:0px 40px 0px 0px;
	font-size:14px;
	color:#2162A1;
	font-weight:normal;
	text-decoration:underline;
}

.LienSelected-Liste
{
	margin:0px 40px 0px 0px;
	font-size:14px;
	color:#2162A1;
	font-weight:normal;
}

.patternPart
{
	margin:0px 0px 0px 0px;
	font-size:12px;
	color:#2162A1;
	font-weight:normal;
	font-style:italic;
}

/* Bouton Voir sa fiche */

.ZoneFiche-Liste
{
	display:flex;
	flex-direction:column;
	justify-content:space-around;
	align-items:center;
}

.btnVoirFiche-Liste
{
	background:#ffd503;
	display:flex;
	flex-direction:column;
	justify-content:center;
	margin:10px 0px 0px 0px;
	width:120px;
	height:36px;
	border-radius:8px;
	cursor:pointer;
	font-size:14px;
	color:rgb(20,34,37);	
	font-variant:small-caps;
	text-align:center;
}

.btnVoirFiche-Liste:hover
{
	background:orange;
}

.image-to-bricklink
{
	margin:10px 0px 0px 0px;
}

#bouton-modifier-part
{
	background:rgb(20,34,37);
	margin:10px 0px 0px 0px;
	height:36px;
	cursor:pointer;
	font-size:20px;
	color:white;
	text-shadow:1px 1px 1px #555;
	font-variant:small-caps;
}

.txtCodeBL-P
{
	display:none;
}

/* Cadre gestion du stock et pièces recherchées */

.zone-gestion-Liste
{
	display:flex;
	flex-direction:column;
	justify-content:center;
	margin:15px 0px 0px 0px;
	padding:5px;
	
}

@media all and (max-width: 480px) /* Mobile */
{
    .zone-gestion-Liste
    {
		margin:10px 0px 0px 0px;
		padding:0px;
    }
}

.cadre-stock-search
{
	display:flex;
	width:350px;
	justify-content:space-around;
	padding:5px;
}

@media all and (max-width: 480px) /* Mobile */
{
    .cadre-stock-search
    {
		margin:10px 0px 0px 0px;
    }
}

.zone-gestion-stock-Liste
{
	display:flex;
	flex-direction:column;
	margin:0px 20px 0px 0px;
}

@media all and (max-width: 480px) /* Mobile */
{
    .zone-gestion-stock-Liste
	{
		margin:0px 10px 0px 0px;
    }
}

.zone-gestion-search-Liste
{
	display:flex;
	flex-direction:column;
	justify-content:flex-start;
}

@media all and (max-width: 480px) /* Mobile */
{
    .zone-gestion-search-Liste
	{
		margin:0px 5px 0px 0px;
    }
}

.cadre-nb-exemplaire-part-Liste
{
	display:flex;
	margin:0px 0px 0px 0px;
}

.boutonDiminuerPart-Liste
{
	cursor:pointer;
	margin:2px 3px 0px 0px;
}

.titreNbExemplaire-Liste
{
	background:rgb(20,34,37);
	padding:1px 0px 3px 0px;
	font-size:10px;
	color:white;
	height:10px;
	text-align:center;
}

.nbPartNoStock-Liste
{
	display:flex;
	flex-direction:column;
	width:60px;
	padding:0px 0px 0px 0px;
	border:1px solid gray;
	font-size:20px;
	font-weight:bold;
	color:rgb(20,34,37);
	text-align:center;
}

.nbPartNoSearch-Liste
{
	background:white;
	display:flex;
	flex-direction:column;
	width:60px;
	padding:0px 0px 0px 0px;
	border:1px solid gray;
	font-size:20px;
	font-weight:bold;
	color:black;
	text-align:center;
}

.nbPartInStock-Liste
{
	background:orange;
	display:flex;
	flex-direction:column;
	width:60px;
	padding:0px 0px 0px 0px;
	border:1px solid gray;
	font-size:20px;
	font-weight:bold;
	color:rgb(20,34,37);
	text-align:center;
}

.nbPartInSearch-Liste
{
	background:orange;
	display:flex;
	flex-direction:column;
	width:60px;
	padding:0px 0px 0px 0px;
	border:1px solid gray;
	font-size:20px;
	font-weight:bold;
	color:rgb(20,34,37);
	text-align:center;
}

.cadreNbAddPartStock-Liste
{
	width:135px;
	display:flex;
	justify-content:center;
	font-size:12px;
	font-weight:normal;
	color:white;
}

.cadreNbAddPartSearch-Liste
{
	width:135px;
	display:flex;
	justify-content:center;
	font-size:12px;
	font-weight:normal;
	color:white;
}

.boutonAugmenterPart-Liste
{
	cursor:pointer;
	margin:2px 0px 0px 3px;
}

/* Zone de rangement */

.zone-gestion-storage
{
	display:flex;
	flex-direction:column;
	margin:0px 20px 0px 0px;
}

@media all and (max-width: 480px) /* Mobile */
{
    .zone-gestion-storage
    {
		margin:0px 0px 0px 0px;
    }
}

.cadre-storage
{
	display:flex;
	align-items:center;
	width:550px;
}

@media all and (max-width: 480px) /* Mobile */
{
    .cadre-storage
    {
		width:360px;
    }
}

.storage-area
{
	background:rgb(230,230,230);
	display:flex;
	width:500px;
	margin:5px 0px 5px 0px;
	padding:5px 0px 5px 5px;
	border:2px solid black;
	border-radius:4px;
	font-family:Cera;
	font-size:18px;
	color:rgb(20,34,37);
	font-weight:normal;
}

@media all and (max-width: 480px) /* Mobile */
{
    .storage-area
    {
		margin:5px 0px 5px 0px;
		padding:10px 0px 10px 5px;
		font-size:14px;
		width:315px;
    }
}

.label-storage
{
	display:flex;
	margin:0px 0px 0px 10px;
	font-size:18px;
	color:black;
}

.label-storage:hover
{
	text-decoration:underline;
}

@media all and (max-width: 480px) /* Mobile */
{
    .label-storage
    {
		font-size:14px;
    }
}

.champCache
{
	display:none;
}