/* roboto-slab-regular - latin */
@font-face {
  font-family: 'Roboto Slab';
  font-style: normal;
  font-weight: 400;
  src: url('https://hep.global/wp-content/uploads/2022/09/roboto-slab-v24-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('https://hep.global/wp-content/uploads/2022/09/roboto-slab-v24-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://hep.global/wp-content/uploads/2022/09/roboto-slab-v24-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('https://hep.global/wp-content/uploads/2022/09/roboto-slab-v24-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('https://hep.global/wp-content/uploads/2022/09/roboto-slab-v24-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('https://hep.global/wp-content/uploads/2022/09/roboto-slab-v24-latin-regular.svg#RobotoSlab') format('svg'); /* Legacy iOS */
}
/* roboto-slab-500 - latin */
@font-face {
  font-family: 'Roboto Slab';
  font-style: normal;
  font-weight: 500;
  src: url('https://hep.global/wp-content/uploads/2022/09/roboto-slab-v24-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('https://hep.global/wp-content/uploads/2022/09/roboto-slab-v24-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://hep.global/wp-content/uploads/2022/09/roboto-slab-v24-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('https://hep.global/wp-content/uploads/2022/09/roboto-slab-v24-latin-500.woff') format('woff'), /* Modern Browsers */
       url('https://hep.global/wp-content/uploads/2022/09/roboto-slab-v24-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('https://hep.global/wp-content/uploads/2022/09/roboto-slab-v24-latin-500.svg#RobotoSlab') format('svg'); /* Legacy iOS */
}

body {
    padding:0;
    margin:0;

    font-size: 18px;
    font-family: 'Roboto Slab', serif;


}


form.inxform h3 {
    font-size: 25px;
    font-weight: 400;
}

div.listfield label, div.textfield label {
    display:none !important;

}

div.label, div.listfield, div.textfield, div.textarea, div.paragraph, div.subscription, div.passfield, div.checkboxfield, div.radiobutton {
    margin: 0px;
}

form.inxform select, form.inxform input {
    -webkit-appearance:none;
    -webkit-border-radius:0px;
    background-color:#ffffff;
    color:#000;
    border:none;
    padding: 12px 20px;
    line-height:1.5;
    border-radius: 50px;
    box-sizing: border-box;
    font-size: 18px;
    font-family: 'Roboto Slab', serif;
    transition: all .3s ease-in-out;
}

form.inxform select:focus, form.inxform input:focus {
    border:none;
    outline:none;
}

form.inxform input:focus {
    box-shadow: inset 0 0 0 2px #000;
}



form.inxform .submit input {
    color:#fff;
    background-color:#000;
    border-top-left-radius:0;
    border-bottom-left-radius:0;
    font-size: 18px;
    font-family: 'Roboto Slab', serif;
}

form.inxform #input_textfield_3{
    border-top-right-radius:0;
    border-bottom-right-radius:0;
}



form.inxform {
    display:flex;
    flex-wrap: wrap;
    padding:0;
    margin:0;
        font-size: 18px;
    font-family: 'Roboto Slab', serif;
}

form.inxform > div{
    margin-bottom:30px;
}

form.inxform #listfield_1{
    margin-right:30px;
}

form.inxform #textfield_3{
    width: auto;
    flex-grow:1;
}

form.inxform #listfield_1 {
    width: calc(30% - 15px);
}

form.inxform #textfield_2{
    width: calc(70% - 15px);
}

form.inxform input.text {
    width: 100%;
}

form.inxform .submit {
  width:auto;
}

form.inxform select {
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}


form.inxform .listfield {
    position: relative;
}

form.inxform .listfield:after {
  border: solid black;
  border-width: 0 2px 2px 0;
  display: block;
  padding: 4px;
  position: absolute;
  content: '';
  right: 22px;
    top: 18px;
  transform: rotate(45deg);

}

form.inxform select::-ms-expand {
     display: none;
}




.tracking_permission {
    order:5;
    width:100%;
}

.tracking_permission label {
    font-size:14px;
}

.tracking_permission label a {
    color:#000;
    text-decoration:underline;
}

form.inxform div.error {
    padding: initial;
    color: #8b0000;
}

.red-color, form.form div.error, form.form p.error, form.form p.error label, form.form span.error {
    color: #8b0000;
}

form.inxform p.email-pref, form.inxform p.no-label {
    margin: 10px 0 0 10px;
    padding: 0;
}

form.inxform .message_missing {
    font-size:16px;
    color: #8b0000;
    width:100%;
}

/* For Checkbox */

form.inxform input[type="checkbox"] {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}

form.inxform .tracking_permission label:before {
content: "";
display: block;
position:absolute;
left:0;
top:-2px;
width: 18px;
height: 18px;
margin-right: 0.5em;
vertical-align: -0.2em;
border: 2px solid #000;
padding: 0.12em;
background-color: transparent;
transition: all 0.3s ease-in-out;
}

form.inxform .tracking_permission label {
  padding-left:40px;
position: relative;
display:block;
}

form.inxform .tracking_permission label:after {
border-right: 2px solid #fff;
border-top: 2px solid #fff;
content: "";
left: 5px;
position: absolute;
top: 9px;
transform: scaleX(-1) rotate(135deg);
transform-origin: left top;
height: 12px;
width: 6px;
display: none;
}
form.inxform .tracking_permission input:hover + label:before {
border-color: #000;
}
form.inxform .tracking_permission input:checked + label:before {
border-color: #000;
background: #000;
}
form.inxform .tracking_permission input:checked + label:after {
-moz-animation: check 0.8s ease 0s running;
-webkit-animation: check 0.8s ease 0s running;
animation: check 0.8s ease 0s running;
display: block;
width: 6px;
height: 12px;
border-color: #fff;
}


@keyframes check {
0% {
height: 0;
width: 0;
}
25% {
height: 0;
width: 6px;
}
50% {
height: 12px;
width: 6px;
}
}


@media (max-width: 550px) {
    form.inxform #listfield_1, form.inxform #textfield_2, form.inxform #textfield_3 {
        width: 100%;
    }

    form.inxform #listfield_1{
    margin-right:0px;
}

form.inxform .submit input {
    border-top-left-radius:50px;
    border-bottom-left-radius:50px;
}

form.inxform #input_textfield_3{
    border-top-right-radius:50px;
    border-bottom-right-radius:50px;
}


.tracking_permission {
    order:initial;
}

form.inxform label {
    font-size: 16px;
}

form.inxform {
    font-size: 16px;
}

form.inxform select, form.inxform input {
    font-size: 16px;
}

form.inxform .submit input {
    font-size: 16px;

}

}
