
  #content_title
  {

	margin:auto;
	padding-right:3%;
	padding-left:3%;
	max-width:600px;
	
	justify-content:center;
	
}


.packaging
{
	padding:1%;
	margin:1%;
	width:350px;
	border:none; 
	background-color:#FFF;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border:#6FBF73 1px solid;
	text-align:left;
	
}
.packaging div
{
	text-align:right;
}
.packaging:hover
{
	
}
#contentPacking
{
	max-width:950px;
	font-weight:normal;
	margin:auto;
	display:flex;
	flex-wrap: wrap;
	justify-content:center;
	align-items: flex-start;
	padding-bottom:3%;
}
#content_gift
{
	max-width:350px;
	font-weight:normal;
	margin:auto;
	display:flex;
	flex-wrap: wrap;
	justify-content:center;
	align-items: flex-end;
	padding-bottom:2%;
	
}
#content_gift div
{
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	
}
#content_fixe
{
	max-width:350px;
	font-weight:normal;
	margin:auto;
	display:flex;
	flex-direction: column;
	
	justify-content:center;
	padding-bottom:3%;
}

#content
{
	max-width:350px;
	font-weight:normal;
	margin:auto;
	display:flex;
	flex-direction: column;
	
	justify-content:center;
	padding-bottom:0%;
}
#content .article
{
	display:inline;
	height:100%;
	width:350px;
	margin:2px;
	background-color:#FFF;
	font-weight:normal;
}
#content #articleAdd
{
	display:flex;
	flex-direction: column;
	height:100%;
	width:350px;
	margin:0px;	
}

#content #articlePriceShopAdd
{
	text-align:center;
	display:inline;
	height:100%;
	width:350px;
}
#content #subTotalScreen
{

	height:100%;
	width:350px;
	margin:2px;
	
}
#subTotalScreen button
{
	padding-top:2%;
	padding-bottom:2%;
}
#controle
{
	text-align:right;
	padding-right:2%;
}
#controle img
{
	cursor:pointer;
	margin-right:2%;
}
#screen_cowbellD, #screen_cowbellE, #screen_cowbellF, #screen_cowbellG
{
	width:55px;
}

#cowbellD, #cowbellE, #cowbellF, #cowbellG
{
	width:200px;
	cursor:pointer;
}
.table-active
{
	font-weight:bold;
}
#flex_container
{
	display:flex;
	flex-wrap: wrap;
	justify-content:center;
	align-items: flex-start;
	
}
#flex_container_instruction
{
	display:flex;
	flex-wrap: wrap;
	justify-content:left;
	align-items: center;
	
}
#flex_container_instruction
{
	max-width:400px;
	margin:auto;
}
#flex_cards
{
	-webkit-border-radius: 5px;
	border-radius: 5px;
	padding:1%;
	margin:1%;
	border:#6FBF73 1px solid;
	width:350px;
	
	cursor:pointer;
}
#flex_cards button
{
	background-color:white;
	width:100%;
	text-align:left;
	border:none;
}

/*---------------- BUTTON CSS ------------------*/

.addButton {
  background-color:#6FBF73;
  display:flex;
  flex-direction: column;
  align-items: center;       /* centre horizontalement */
  justify-content: center;   /* centre verticalement */
  padding-top:4%;
  padding-bottom:4%;
  cursor:pointer;
  color:#ffffff;
  font-family:Arial;
  font-size:xx-large;
  font-weight:bold;
  width:100%;
  height:100%;
  text-decoration:none;
  border:none;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

.addButton:hover {
	background-color:#8CC78B;
}

.addShopButton {
	background-color:#b17ee8;

	display:block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-weight:bold;
	width:100%;
	height:100%;
	text-decoration:none;
	border:none;
	-webkit-border-radius: 5px;
border-radius: 5px;
}
.addShopButton:hover {
	background-color:#8CC78B;
	
}
/* Formes de base (écrase le radius Bootstrap) */
.custom-rounded{
  border-radius:5px;
  border-top-right-radius:1rem;
  border-bottom-left-radius:1rem;
}
.custom-rounded:hover{
	 border:1px solid ;
}
.custom-rounded-reverse{
  border-radius:5px;
  border-top-left-radius:1rem;
  border-bottom-right-radius:1rem;
 
}

@keyframes playCornersA {
  0%   {border-top-left-radius:5px; border-top-right-radius:1rem; border-bottom-right-radius:5px; border-bottom-left-radius:1rem;}
  40%  {border-top-left-radius:1.5rem; border-top-right-radius:.3rem; border-bottom-right-radius:1.5rem; border-bottom-left-radius:.3rem;}
  70%  {border-top-left-radius:.7rem; border-top-right-radius:.7rem; border-bottom-right-radius:.7rem; border-bottom-left-radius:.7rem;}
  100% {border-top-left-radius:5px; border-top-right-radius:1rem; border-bottom-right-radius:5px; border-bottom-left-radius:1rem;}
}

@keyframes playCornersB {
  0%   {border-top-left-radius:1rem; border-top-right-radius:5px; border-bottom-right-radius:1rem; border-bottom-left-radius:5px;}
  40%  {border-top-left-radius:.3rem; border-top-right-radius:1.5rem; border-bottom-right-radius:.3rem; border-bottom-left-radius:1.5rem;}
  70%  {border-top-left-radius:.7rem; border-top-right-radius:.7rem; border-bottom-right-radius:.7rem; border-bottom-left-radius:.7rem;}
  100% {border-top-left-radius:1rem; border-top-right-radius:5px; border-bottom-right-radius:1rem; border-bottom-left-radius:5px;}
}

/* Application */
.custom-rounded.animate {
  animation: playCornersA .3s cubic-bezier(.25, 1.5, .5, 1);
}

.custom-rounded-reverse.animate {
  animation: playCornersB .3s cubic-bezier(.25, 1.5, .5, 1);
}




			.custom-rounded-top {
			  border-bottom-left-radius: 1rem; /* arrondi bas gauche */
			}
			.custom-rounded-bottom {
			  border-top-right-radius: 1rem; /* arrondi haut droit */
			}
			