/* ----- +error ----- */
form .error-msg { border:1px solid;clear:both;margin:.69em 0;padding:.5em 1em; }
form .error-msg legend { border:1px solid;padding:.2em .5em;margin:0; }
form .error-msg ul { list-style-type:square;margin-left:20px;overflow:visible; }
form .error-msg ul li { clear:both;float: none;list-style-image:none;padding:2px 0;width:auto; }
form .error-msg label { float:none;display:block;margin:0;padding:0;width:100%;color: #333; }
form li.error input, form li.error select, form li.error textarea { font-weight:normal; }
form .error-msg, form .error-msg legend {background-color: #ffc8c8;border-color:#d90000;}
form .error-msg legend { background-color:#d90000;color:#fff; }
form .error-msg { background-color: #FFCECF;border-color:#d90000;border-left:3px solid #d90000; }
form .colorederror-msg { background-color: #FFFFFF; border-color:#e66b2e; }
form li.error label {color:#d90000;}
input[type=text]:focus:invalid,
input[type=email]:focus:invalid,
input[type=url]:focus:invalid,
input[type=date]:focus:invalid,
input[type=tel]:focus:invalid,
input[type=number]:focus:out-of-range,
form li.error input, form li.error select, form li.error textarea {border-color:#d90000;}
form .error-msg h4:before { content: none; }
form ol, form ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
}
fieldset{
	border: none;
	position: relative;
}
.form-li{margin: 20px 0}
label{position: relative}
label > *{display: inline-block}
label:not(.radiotxt){
	font-size: var(--16px);
	color: var(--darkgrey);
}
input, textarea{
	background-color: transparent;
	border: 2px solid var(--darkgrey);
	position: relative;
	outline: none;
}
input.checkbox,input.radio{
	border: none;
}
input{
	border-top: none !important;
	border-left: none !important;
	border-right: none !important;
	width: 100%;
	font-size: 1em;
	min-height: 50px;
	transition: 0.3s ease;
}
input:focus{border-color: var(--red);}
input::placeholder{font-style: italic;}
textarea{
	display: block;
	width: 100%;
}
label.checktxt, label.radiotxt{
	padding-left: 1.7em;
	cursor: pointer;
	color: black;
}
label.checktxt::before, label.radiotxt::before{
	content: "";
	color: #fff;
	display: inline-block;
	width: 1em;
	height: 1em;
	cursor: pointer;
	background-repeat: no-repeat;
	background-color: transparent;
	border: 2px solid var(--darkgrey);
	  border-top-color: rgb(112, 112, 112);
	  border-right-color: rgb(112, 112, 112);
	  border-bottom-color: rgb(112, 112, 112);
	  border-left-color: rgb(112, 112, 112);
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out;
	background-position: center;
	background-size: calc(100% - 2px);
	position: absolute;
	top: 0.55em;
	left: 0;
	transform: translateY(-50%);
}
input[type="checkbox"]{ cursor: pointer}
input[type="checkbox"]:checked + label.checktxt::before{
	background-image: url("/_assets/css/icon/check-white.svg");
	background-color: var(--red);
	border-color: var(--red);
}
label.radiotxt::before, label.radiotxt::after{border-radius: 50%}
label.radiotxt::after{
	width: calc(1em - 4px);
	height: calc(1em - 4px);
	background-color: var(--red);
	position: absolute;
	top: 0.55em;
	left: 4px;
	transform: translateY(-50%);
}
input[type="radio"]:checked + label.radiotxt::after{ content: ""}
.radio-item{margin: 5px 0}
input:required + label {
    font-weight: bold;
}
#formmail li{margin: 20px 0}
select{display: none}
.module_shopproxy select, .module_allshopproxy select{display: inline-block}
.custom-select{
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 10px 0;
	border-bottom: 2px solid var(--darkgrey);
}
.custom-select.open{border-color: var(--red);}
.custom-select__trigger{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
}
.custom-select__trigger .arrow{
	position: relative;
	height: 15px;
	width: 15px;
	background: url("/_assets/css/icon/arrow.svg") no-repeat center;
	background-size: contain;
	filter: var(--filter-red);
	transition: 0.3s ease;
}
.custom-select.open .arrow{ transform: rotateX(180deg)}
.custom-options{
	position: absolute;
	display: none;
	top: 51px;
	left: 0;
	right: 0;
	background-color: var(--grey);
	transition: all 0.3s;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	z-index: 2;
	padding: 10px;
	overflow-y: hidden;
	overflow-x: hidden;
}
.custom-option{
	position: relative;
	display: block;
	padding: 10px 0;
	cursor: pointer;
}
.custom-option:hover{color: var(--red);}
.custom-select.open .custom-options{
	display: block;
	pointer-events: all;
	max-height: 300px;
	overflow-y: auto;
	z-index: 999;
	opacity: 1;
	visibility: visible
}
.control{margin: 0 0 25px 0;}

@media screen and (min-width: 768px){
	.module_formmail #breadcrumbNav{left: 6px}
	#form-description{margin: 0 6px}
	#formmail .tarn > li{margin: 15px 6px}
	li.half{
		float: none;
		display: inline-block;
		width: calc(50% - 16px);
	}
	/*li.half:nth-of-type{margin: 20px 11px !important}*/
}

@media screen and (min-width: 1024px){
	#formmail > fieldset:first-child{margin-top: 25px}
	.control{margin: 0 0 50px 0;}
}