/* FORM
======================================================= */
.form-block .container .container{padding:0; width:100% !important;}

.form-block hgroup{margin-bottom:calc(var(--ss)*35vw);}
.form-block .copy{margin-bottom:calc(var(--ss)*60vw);}

@media(max-width:768px){
    .form-block hgroup{padding:0 calc(var(--ss)*30vw)}
}

@media(min-width:769px){
    .form-block hgroup{margin-bottom:calc(var(--ss)*40vw);}
    .form-block .copy{margin-bottom:calc(var(--ss)*80vw);}
    .form-block .grid.grid-2 h3{grid-column: 1 / span 2;}
}

@media(min-width:1441px){
    .form-block hgroup{margin-bottom:calc(40/16*1rem);}
    .form-block .copy{margin-bottom:calc(80/16*1rem);}
}

/* IOS FIXES */
@media(max-width:768px){}


/* ERROR TEXT */
form span.red.text {position:absolute;bottom:calc(var(--ss)*5vw); color:var(--orange); font:var(--pxs)}

/* FIELDS */
form .segment{margin-bottom:calc(var(--ss)*60vw);}
form .segment > .field{margin-bottom:0; position:relative; width:100%;}
form .segment:last-child,
form .segment > .field:last-child{margin-bottom: 0 !important;}


form div.grid-2 label{grid-column:1 / 3}

/* INPUT */
form input[type="text"], form input[type="text"]:focus, form input[type="text"]:hover, form .error input[type="text"],
form input[type="tel"], form input[type="tel"]:focus, form input[type="tel"]:hover, form .error input[type="tel"],
form textarea, form .selection.dropdown{padding:0 0 calc(var(--ss)*40vw); border:0; border-bottom:var(--border-dgreen); box-shadow:none; border-radius:0; background: transparent; margin-bottom:0; font:var(--ps); min-height:fit-content; display:flex; align-items: center; line-height:1; color:var(--dgreen ); width:100%; text-align: left; }

/*form textarea{ height:calc(var(--ss)*132vw);}*/

/*form .mainfield > label{width:100%;font:var(--title); margin-bottom:var(--spacing); text-transform: uppercase; letter-spacing:var(--ls07)}*/

#required-text p{font:var(--ps); color:var(--dgreen);}

@media(max-width:768px){
    .contact-form-block form{padding:0 var(--xpad)}
}

@media(min-width:769px){
    form .segment{margin-bottom:calc(70/16*1rem);}
    
    form .form-content{width:calc(var(--ss)*744vw); margin-left: auto; margin-right:auto;}
    .contact-form-block form .form-content{width:calc(var(--ss)*930vw);}
    
}

@media(min-width:1441px){
     .contact-form-block form .form-content{width:calc(930/16*1rem);}
    form .form-content{width:calc(744/16*1rem);}
   
    
    form .segment{margin-bottom:calc(70/16*1rem);}
    form input[type="text"], form input[type="text"]:focus, form input[type="text"]:hover, form .error input[type="text"],
    form input[type="tel"], form input[type="tel"]:focus, form input[type="tel"]:hover, form .error input[type="tel"],
    form textarea, form .selection.dropdown{padding:0 0 calc(40/16*1rem);}

}

/* IOS FIXES */
@media(max-width:768px){}



/* SELECT
======================================================= */
form div[data-vtype="select"]{z-index:1000;}
form .selection.dropdown{position:relative; cursor:pointer;}
.dropdown > select { display: none; }
form .dropdown:not(.button) > .default.text.placeholder{opacity:1}
form .default.dropdown:not(.button) > .text, form .dropdown:not(.button) > .default.text{font:var(--ps);}

form .selection.dropdown .menu{outline: 0; margin: 0; max-height:calc(var(--ss)*467vw); box-shadow: 0 2px 3px 0 rgba(34,36,38,.15); background:var(--lcream); border-radius:0; border:var(--border-dgreen); width:100%;overflow-x: hidden; overflow-y: auto; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-overflow-scrolling: touch;transition: opacity .1s ease;left: 0;cursor: auto; position: absolute;  top:100%;padding:0;font:var(--ps); text-shadow: none; text-align: left; z-index: 1000; }

form .field .dropdown .menu > .item{font:var(--ps); color:var(--dgreen); padding:calc(var(--ss)*15vw); z-index: 11; will-change: transform,opacity; margin:0 auto;height:calc(var(--ss)*40w); display:flex;align-items: center; justify-content: flex-start; border-radius:0; transition:all 0.3s;border:none; width:100%; cursor:pointer; background:var(--lcream)}
form .field .dropdown .menu > .item:not(:last-child){border-bottom:var(--border-stone)}
form .field .dropdown .menu > .item.active{background-color:var(--cream);}
form .field .dropdown .menu > .item:not(.active):focus,
form .field .dropdown .menu > .item:not(.active):hover{background-color:rgba(255, 255, 255, 0.5)}

form .selection.dropdown > .dropdown.icon{width:calc(var(--ss)*12vw); height:calc(var(--ss)*21vw); bottom:calc(var(--ss)*6vw); right:0; transition: transform 0.3s; background:url('/templates/bargate/images/shared/dropdown.svg') center / contain no-repeat; margin: 0; padding:0; opacity:1;cursor: pointer;position: absolute;z-index: 3;}
form .selection.dropdown.active > .dropdown.icon{transform:translateY(-50%) scaleY(-1);}
form .selection.dropdown > .dropdown.icon::before {display: none;}

@media(max-width:768px){}

@media(min-width:769px){}

@media(min-width:1441px){
    form .selection.dropdown .menu{max-height:calc(467/16*1rem); }

    form .field .dropdown .menu > .item{padding:calc(15/16*1rem);height:calc(40/16*1rem);}
    form .selection.dropdown > .dropdown.icon{width:calc(12/16*1rem); height:calc(21/16*1rem); bottom:calc(6/16*1rem);} 
}

/* IOS FIXES */
@media(max-width:768px){}


/* CHECKBOXES
======================================================= */
form .checkbox label{display:flex;padding-left:calc(var(--ss)*45vw); font:var(--ps); margin-bottom:0; align-items:flex-start; padding-top:0; height:fit-content; position:relative;}

form .checkbox label:before{position: absolute; left:0; top:0; content:''; height:calc(var(--ss)*20vw); width:calc(var(--ss)*20vw); color:var(--dgreen); background:transparent; border:var(--border-dgreen); z-index:1; transition:border 0.3s; display: flex; justify-content: center; align-items: center; cursor:pointer; border-radius:calc(var(--ss)*5vw)}

form .checkbox.checked label:before{ content: "✓";}

form .checkbox:after,
form .checkbox label:after{display:none;}

form .field.error .checkbox label::before{background:transparent;}

@media(max-width:768px){
}

@media(min-width:769px){}

@media(min-width:1441px){
    form .checkbox label{padding-left:calc(45/16*1rem);}

	form .checkbox label:before{height:calc(20/16*1rem); width:calc(20/16*1rem); border-radius:calc(15/16*1rem)}
}

/* IOS FIXES */
@media(max-width:768px){
}



/* CHECKBOX
======================================================= */
form .chckbox{width:100%;}
form .chckbox label{display:flex;padding-left:calc(var(--ss)*45vw); font:var(--btn); margin-bottom:0; align-items:flex-start; padding-top:0; height:fit-content; text-transform: uppercase; letter-spacing: var(--ls05)}

form .chckbox label:before{position: absolute; left:0; top:0; content:''; height:calc(var(--ss)*20vw); width:calc(var(--ss)*20vw); color:var(--dgreen); background:transparent; border:var(--border-dgreen); z-index:1; transition:border 0.3s; display: flex; justify-content: center; align-items: center; cursor:pointer; border-radius:calc(var(--ss)*5vw)}

form .chckbox.checked label:before{ content: "✓";}

form .chckbox:after,
form .chckbox label:after{display:none;}

form .field.error .chckbox label::before{background:transparent;}

@media(max-width:768px){
}

@media(min-width:769px){}

@media(min-width:1441px){
    form .chckbox label{padding-left:calc(45/16*1rem);}

	form .chckbox label:before{height:calc(20/16*1rem); width:calc(20/16*1rem); border-radius:calc(5/16*1rem)}
}

/* IOS FIXES */
@media(max-width:768px){
}


/* CHECKBOXES (BTN GROUP) 
======================================================= */
form div.btn-group .checkboxes label{padding: 0 calc(var(--ss)*20vw); background:transparent; color:var(--dgreen); border:var(--border-dgreen); font:var(--btn); transition: all 0.3s; height:calc(var(--ss)*45vw); display:flex; justify-content: center; align-items: center; border-radius:calc(var(--ss)*50vw); cursor:pointer; text-transform: uppercase; letter-spacing:var(--ls05); gap:calc(var(--ss)*10vw)}
form div.btn-group .checkboxes.checked label{ background: var(--yellow)}
form div.btn-group .checkboxes:not(.checked):hover label{background:var(--yellow);}

form div.btn-group .checkboxes label:before{display: none;}

/*form div.btn-group .checkboxes label:after{display: block; content:''; width:calc(var(--ss)*11vw); height:calc(var(--ss)*12vw); background:url('/templates/bargate/images/shared/arrowr.svg') center / contain no-repeat;}*/

@media(max-width:768px){
    form div.btn-group .checkboxes label{background:var(--yellow);}
    form div.btn-group .checkboxes.checked label{ background: var(--dgreen); color:var(--lcream);}
}

@media(min-width:769px){
}

@media(min-width:1441px){
	form div.btn-group .checkboxes label{padding: 0 calc(20/16*1rem);height:calc(45/16*1rem);border-radius:calc(50/16*1rem);gap:calc(10/16*1rem)}
    
/*    form div.btn-group .checkboxes label:after{width:calc(11/16*1rem); height:calc(12 /16*1rem);}*/
}


/* RADIO
======================================================= */

/*
form .radio label{ font:var(--p1); line-height: 1; padding-left:calc(var(--ss)*45vw); height:calc(var(--ss)*20vw); display:flex; align-items: center; position:relative; cursor:pointer;}
form .radio label:before{position: absolute; left:0; top:0; content:''; height:calc(var(--ss)*20vw); width:calc(var(--ss)*20vw); min-width:calc(var(--ss)*20vw); border-radius:0; background:transparent; border:var(--border); z-index:1; transition:all 0.3s; cursor:pointer; }
form .radio.checked label:before{background:var(--white); border-color:var(--black)}

@media(max-width:768px){
    form div[data-vtype="radios"] .field:not(:last-child){margin-bottom:calc(var(--ss)*27vw);}
}

@media(min-width:769px){
    form .mainfield[data-vtype="radios"] > .field{width:calc(50% - calc(var(--ss)*2.5vw))}
	
}

@media(min-width:1441px){
    form .radio label{ padding-left:calc(45/16*1rem); height:calc(20/16*1rem);}
    form .radio label:before{height:calc(20/16*1rem); width:calc(20/16*1rem); min-width:calc(20/16*1rem);}
}
*/


/* TEMPLATE
======================================================= */

@media(max-width:768px){}

@media(min-width:769px){
    .contact-form-block #register_submit{width:calc(var(--ss)*320vw)}
    
    .contact-form-block .field[data-vtype="button"],
    .contact-form-block #required-text{margin-top:calc(var(--ss)*20vw);}
	.newsletter-form-block .field[data-vtype="button"],
    .newsletter-form-block #required-text{margin-top:calc(var(--ss)*45vw);}
}

@media(min-width:1441px){8
    .contact-form-block #register_submit{width:calc(320/16*1rem)}
    
    .contact-form-block .field[data-vtype="button"],
    .contact-form-block #required-text{margin-top:calc(20/16*1rem);}
	.newsletter-form-block .field[data-vtype="button"],
    .newsletter-form-block #required-text{margin-top:calc(45/16*1rem);}

}

/* IOS FIXES */
@media(max-width:768px){}







/*
PLACEHOLDERS :-(
========================================================== */

input::-webkit-input-placeholder { opacity:1; color:inherit !important; font:inherit;}
input::-moz-placeholder { opacity:1; color:inherit !important; font:inherit; padding:inherit; border-radius:inherit;}
input:-ms-input-placeholder { opacity:1; color:inherit !important; font:inherit; padding:inherit; border-radius:inherit;}
input:-moz-placeholder { opacity:1; color:inherit !important; font:inherit; padding:inherit; border-radius:inherit;}

textarea::-webkit-input-placeholder { opacity:1; font:inherit; color:inherit !important; padding:0;}
textarea::-moz-placeholder { opacity:1; font:inherit; color:inherit !important; padding:0; border-radius:inherit;}
textarea:-ms-input-placeholder { opacity:1; font:inherit; color:inherit !important; padding:0; border-radius:inherit;}
textarea:-moz-placeholder { opacity:1; font:inherit; color:inherit !important; padding:0; border-radius:inherit;}
