@font-face {
  font-family: 'ralewayregular';
  src: url('/fonts/raleway-regular-webfont.eot');
  src: url('/fonts/raleway-regular-webfont.eot?#iefix') format('embedded-opentype'),
  url('/fonts/raleway-regular-webfont.woff2') format('woff2'),
  url('/fonts/raleway-regular-webfont.woff') format('woff'),
  url('/fonts/raleway-regular-webfont.ttf') format('truetype'),
  url('/fonts/raleway-regular-webfont.svg#ralewayregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

body, p, img, table, ul, li, div, a, dl, dt, dd, form, fieldset, h1, h2, h3, h4 {
  margin: 0;
  padding: 0;
  color: #2d2c2e;
  font: 13px ralewayregular, Tahoma, Geneva, Kalimati, sans-serif;
  	line-height : 1.5;
}

body {
  background-color : #f0f0f0;
}

#form_zone {
	width : 90%;
	max-width : 960px;
	margin : 30px auto;
/*	opacity:0.8;								
	filter:alpha(opacity=80); */	
  border-radius : 6px;
  -moz-border-radius : 6px; 
  -webkit-box-shadow: 3px 3px 3px 2px rgba(0, 0, 0, 0.6);
	box-shadow: 3px 3px 3px 2px rgba(0, 0, 0, 0.6);
	padding : 0;
	background-color: #f0f0f0;
}


#form_zone_inside {
	background-color : #f0f0f0;
	max-width : 960px;
	padding : 25px 15px;
	margin : 0;
}

#header {
	background-color : #000000;
	padding : 30px;
}

div.fieldset-header {
	padding-bottom : 20px;
}

div.fieldset-footer {
	padding-top : 15px;
	padding-bottom : 15px;
}

p.footerbloc {
	font: 11px ralewayregular, Tahoma, Geneva, Kalimati, sans-serif;
	color: #ffffff;
  line-height : 1.5;
  background-color: #d03f8b;
  padding: 7px;
  text-align: center;
  margin: 0 auto;
  border-radius: 3px;
  width: 70%;
}

div.fieldset-header img {
	width: 100%;
	max-width: 400px;
}

#header img {
	text-align: center;	
	margin: 0 auto;
	width: 100%;
	max-width: 262px;
}

div.cart img {
	text-align: center;	
	margin: 0 auto;
	padding-bottom: 10px;
}


p.soustitre {
	font: 15px ralewayregular, Tahoma, Geneva, Kalimati, sans-serif;
	color: #ffffff;
  line-height : 1.7;
  background-color: #777777;
  padding: 7px;
  text-align: center;
  margin: 0 auto;
  border-radius: 6px;
}


#footer {
	background-color : #000000;
	padding : 30px;	
}

#footer p {
	color: #ffffff;
}

#footer img {
	width: 100%;
	max-width: 120px;
	margin-top: 10px;
	border: 0;
}

button, .button {
	border : none;
	background : none;
	cursor : pointer;
	background-color : #000000;
	color : #ffffff;
	padding : 15px 30px; 
	text-decoration : none;
	height : auto;
	transition: background-color .3s;
	-webkit-appearance: none;
	border-radius : 3px;
	font-weight: 300;
	width : 70%;
	max-width : 200px;
	text-transform : uppercase;
	font-size : 14px;
}

button:hover, .button:hover {
	background-color: #d03f8b;
	color : #ffffff;
	-webkit-appearance: none;
}

label.label-after-radio {
	display : inline-block;
	border : none;
	color : #000000;	
	cursor : pointer;
	margin : 0;
	padding : 5px 10px;
	float : none;
	background: none;
	transition: background .3s;
	font-size : 1em;
}

label.label-after-radio:hover {
	background : #000000;
	color: #ffffff;
}

div.radio_option {
	text-align : left;
	margin: 0 10px;
	display: inline-block;
	width: 130px;
}

div.radio_option input {
	position : relative;
	top : 4px;
	cursor : pointer;
}


p {
  margin-bottom : 4px;
}


div.field {
clear : left;
margin-top : 10px;
}

label {
	display : block;
	float : left;
	max-width : 180px;
	text-align : right;
	position : relative;
	padding-right : 12px;
	margin-top : 6px;
}

div.field_info {
color : #777777;
margin-left : 220px;
font-size : 0.7em;
clear : left;
}


.spacer_right {
margin-right : 20px;
}

div#notice, .notice {
  color : #c1cf0e;
  display : inline-block;
  margin : 10px 0;
  font-weight : bold;
}

div#error, .error {
  color : #d97272;
  display : inline-block;
  margin : 10px 0;
  font-weight : bold;
}


div#alert, .alert {
  color : #85102B;
  display : inline-block;
  margin : 10px 0;
  font-weight : bold;
}


div.field_errors {
  font-size : 0.8em;
  color : #d97272;
  
}

div.field_with_errors {
  display : inline;
}


div.field_with_errors input, input.field_with_errors {
  background-color : #d97272; 
/*  color : #ffffff; */
}


.error {
  color : #85102B;
}

div.submit_zone {
	margin : 25px 0 0 260px;
}

div.zone_submit_left {
  margin : 10px 0;
}


textarea {
	width : 50%;
	height : 100%;
	vertical-align : middle;
	background-color : #ffffff;
	border: 1px solid #CCC;
	border-radius: 4px;
	transition: all 150ms ease-in-out 0s;
}

textarea.txt_input {
	width : 98%;
	padding : 1%;
	resize: none;

	background-color: #ffffff;
		max-width: 293px;

}

div.tooltip_zone {
	position : relative;
}


div.tooltip_text {
	position : absolute;
  z-index:9999;
	display : none;
	left : 50px;
	top : 15px;
  background-color:#000;
  color:#fff;
	background-color : #444444;
	padding : 8px;
	
}

div.input_zone {
  margin-left : 220px;
}

div.input_zone > input {
    width: 99%;
    max-width: 300px;
    height: 36px;
    vertical-align: middle;
    font-size: 1.05em;
    padding: 0 0 0 1%;
    outline: none;
    color: #333;
    border: 1px solid #CCC;
    border-radius: 3px;
    transition: all 150ms ease-in-out 0s;
}

label.label-after-check {
	display : inline-block;
	border : none;
	color : #000000;	
	cursor : pointer;
	margin : 0;
	padding : 5px 10px;
	float : none;
	background: none;
	transition: background .3s;
	font-size : 1em;
}

label.label-after-check:hover {
	background : #000000;
	color: #ffffff;
}

span.mandatory-tag {
	position : absolute;
	right : 0;
	top : 0;
	color : #d03f8b;
}

div.port input, div.port .field .spinner input.std_input {
	display: none;
}

div.port label {
	width: 100%;
	float: none;
	display: block;
	max-width: none;
	text-align: center;
}

div.cart input {
	width : 99%;
	height : 36px;
	font-size : 1.5em;
	text-align : center;
	padding: 0 0 0 1%;
}

div.cart label {
	font-size : 1.8em;
}

a.payment {
	display : inline-block;
	padding : 10px 20px;
	border : 1px solid #ffffff;
	text-decoration : none;
	font-size : 1.2em;
	background-color: #0056a0;
	border-radius: 6px;
	-moz-border-radius : 6px; 
  -webkit-box-shadow: 3px 3px 3px 2px rgba(0, 0, 0, 0.6);
	box-shadow: 3px 3px 3px 2px rgba(0, 0, 0, 0.6);
	color: #ffffff;
	    transition: all 300ms ease-in-out 0s;
}

a.payment:hover {
	border : 1px solid #ffffff;
	background-color: #5e94c3;
	color: #ffffff;
}

p.titre-commande {
	line-height: 1.7em;
	color: #d03f8b;
}

p.montant-commande {
	line-height: 1.7em;
	margin: 20px;
}

p.total-commande {
	line-height: 1.7em;
	font-size: 18px;
	color: #d03f8b;
	margin: 15px auto;
	font-weight: bold;
}



.field.product .input_zone {
	width : 250px;
}


.field.product {
  display: block;
  overflow: hidden;
}

.field.product label, .field .spinner, .field.product .input-group-btn, .field.product input {
  display: block;
  float: left;
  width: auto;
}

.field .spinner {
  overflow: hidden;
  float: right;
}

.field .spinner input.std_input {
  width: 60px;
  border-radius: 0;
  text-align: center;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
  color: #555;
  display: block;
  font-size: 1.6em;
  font-weight : bold;
  height: 34px;
  line-height: 1.42857;
  padding: 6px 12px;
  transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
  border-radius: 0;
  margin: 0;
}

.field.product .spinner span.input-group-btn {
  overflow: hidden;
}

.field.product .spinner span.input-group-btn button {
  padding: 9px 12px;
  margin: 0;
  width: 39px;
  background-color: #d03f8b;
  border-color: #d43f3a;
  color: #fff;
}

.field.product .spinner span.input-group-btn button:hover {
  background-color: #d03f8b;
  border-color: #ac2925;
  color: #fff;
}


.field.port .spinner {
  display : none;
}




@media screen and (max-width: 620px) {

div.input_zone {
  margin-left : 120px;
}

label {
	max-width : 100px;
}

div.submit_zone {
	padding: 20px;
  margin : 0 auto;
  text-align: center;
}

}

@media screen and (max-width: 480px) {


.field.product label, .field.product .input_zone {
  display: block;
  float: none;
  width: auto;
  text-align : center;
}
.field.product .input_zone {
	margin : 0;
	width: 100%;
}

.field.product .spinner {
	float: none;
	margin-left : 20%;
}



}