:root {
	/* Inputs */
	--input-bg: #F1F1F1;
	--input-border-color: var(--input-bg);
	--input-border: 1px solid var(--input-border-color);
	--input-border-radius: 0px;
	--input-font-color: #14102F;
	--input-font-size: 17px;
	--input-letter-spacing: 0.012em;
	--input-font-weight: 400;
	--input-placeholder: #555555;
	--input-box-shadow: none;
	--input-padding: 0.58em 0.704em;
	--input-width: 100%;
	/* Input: Hover */
	--input-border-color--hover: #E0E0E0;
	/* Input: Focus */
	--input-border-color--focus: #14102F;
	/* Input: Invalid */
	--input-bg--invalid: #FFEAE8;
	--input-border-color--focus--invalid: #FFEAE8;
	--input-font-color--invalid: #D94433;
	/* Input: Disabled */
	--input-bg--disabled: #FAFAFA;
	--input-font-color--disabled: #BABABA;
	/* Placeholder */
	--input-placeholder-font-color: #555555;
}

input {
	margin-bottom: 1.04em;
}

/* Placeholders */
input::-webkit-input-placeholder,
input:-moz-placeholder,
input::-moz-placeholder,
input:-ms-input-placeholder,
input::placeholder,
textarea::-webkit-input-placeholder,
textarea:-moz-placeholder,
textarea::-moz-placeholder,
textarea:-ms-input-placeholder,
textarea::placeholder {
	color: var(--input-placeholder-font-color);
	opacity: 1;
	font-weight: 400;
}

/* Text fields */
input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
select,
textarea {
	font-family:      var(--fontstack--oswald);
	background-color: var(--input-bg);
	border:           var(--input-border);
	border-radius:    var(--form-border-radius);
	box-shadow:       var(--input-box-shadow);
	color:            var(--input-font-color);
	font-size:        var(--input-font-size);
	font-weight:      var(--input-font-weight);
	letter-spacing:   var(--input-letter-spacing);
	padding:          var(--input-padding);
	width:            var(--input-width);
}

input[type="color"] {
	padding: 5px;
}

select {
	appearance: none;
	background-image: url(https://www.digfingroup.com/wp-content/themes/zox-news-child/css/inputs/images/select-bg.svg);
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 14px 12px;
}

input[type="color"]:disabled,
input[type="date"]:disabled,
input[type="datetime"]:disabled,
input[type="datetime-local"]:disabled,
input[type="email"]:disabled,
input[type="month"]:disabled,
input[type="number"]:disabled,
input[type="password"]:disabled,
input[type="search"]:disabled,
input[type="tel"]:disabled,
input[type="text"]:disabled,
input[type="time"]:disabled,
input[type="url"]:disabled,
input[type="week"]:disabled,
textarea:disabled,
select:disabled {
	background-color: var(--input-bg--disabled);
	color:            var(--input-font-color--disabled);
}

input[type="color"]:hover:not(:focus),
input[type="date"]:hover:not(:focus),
input[type="datetime"]:hover:not(:focus),
input[type="datetime-local"]:hover:not(:focus),
input[type="email"]:hover:not(:focus),
input[type="month"]:hover:not(:focus),
input[type="number"]:hover:not(:focus),
input[type="password"]:hover:not(:focus),
input[type="search"]:hover:not(:focus),
input[type="tel"]:hover:not(:focus),
input[type="text"]:hover:not(:focus),
input[type="time"]:hover:not(:focus),
input[type="url"]:hover:not(:focus),
input[type="week"]:hover:not(:focus),
textarea:hover:not(:focus),
select:hover:not(:focus) {
	border-color: var(--input-border-color--hover);
}

input[type="color"]:focus,
input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="email"]:focus,
input[type="month"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="time"]:focus,
input[type="url"]:focus,
input[type="week"]:focus,
textarea:focus,
select:focus {
	border-color: var(--input-border-color--focus);
	outline: none;
}

input[type="color"]:not(:placeholder-shown):invalid,
input[type="date"]:not(:placeholder-shown):invalid,
input[type="datetime"]:not(:placeholder-shown):invalid,
input[type="datetime-local"]:not(:placeholder-shown):invalid,
input[type="email"]:not(:placeholder-shown):invalid,
input[type="month"]:not(:placeholder-shown):invalid,
input[type="number"]:not(:placeholder-shown):invalid,
input[type="password"]:not(:placeholder-shown):invalid,
input[type="search"]:not(:placeholder-shown):invalid,
input[type="tel"]:not(:placeholder-shown):invalid,
input[type="text"]:not(:placeholder-shown):invalid,
input[type="time"]:not(:placeholder-shown):invalid,
input[type="url"]:not(:placeholder-shown):invalid,
input[type="week"]:not(:placeholder-shown):invalid,
textarea:not(:placeholder-shown):invalid,
select:invalid {
	background-color: var(--input-bg--invalid);
	border-color:     var(--input-bg--invalid);
	color:            var(--input-font-color--invalid);
}

input[type="color"]:invalid:hover:not(:focus),
input[type="date"]:invalid:hover:not(:focus),
input[type="datetime"]:invalid:hover:not(:focus),
input[type="datetime-local"]:invalid:hover:not(:focus),
input[type="email"]:invalid:hover:not(:focus),
input[type="month"]:invalid:hover:not(:focus),
input[type="number"]:invalid:hover:not(:focus),
input[type="password"]:invalid:hover:not(:focus),
input[type="search"]:invalid:hover:not(:focus),
input[type="tel"]:invalid:hover:not(:focus),
input[type="text"]:invalid:hover:not(:focus),
input[type="time"]:invalid:hover:not(:focus),
input[type="url"]:invalid:hover:not(:focus),
input[type="week"]:invalid:hover:not(:focus),
textarea:invalid:hover:not(:focus),
select:invalid:hover:not(:focus) {
	border-color: var(--input-bg--invalid)
}

input[type="color"]:invalid:focus,
input[type="date"]:invalid:focus,
input[type="datetime"]:invalid:focus,
input[type="datetime-local"]:invalid:focus,
input[type="email"]:invalid:focus,
input[type="month"]:invalid:focus,
input[type="number"]:invalid:focus,
input[type="password"]:invalid:focus,
input[type="search"]:invalid:focus,
input[type="tel"]:invalid:focus,
input[type="text"]:invalid:focus,
input[type="time"]:invalid:focus,
input[type="url"]:invalid:focus,
input[type="week"]:invalid:focus,
textarea:invalid:focus,
select:invalid:focus {
	border-color: var(--input-font-color--invalid);
}

input[type="submit"] {
	background-color: black;
	color: white;
	text-transform: uppercase;
	font-family: 'Oswald', sans-serif;
	font-size: 16px;
	padding: 12px;
	min-width: 270px;
	text-align: center;
	border: none;
	margin: 0 auto;
	display: block;
	margin-top: 9px;
}
.rcp_button {
	background-color: black;
	color: white;
	text-transform: uppercase;
	font-family: 'Oswald', sans-serif;
	font-size: 14px;
	padding: 12px 16px;
	text-align: center;
	border: none;
	margin: 0 auto;
	margin-top: 9px;
}

/* These are selectors for any item that takes a range. */

input[min][max]:in-range {}

input[min][max]:out-of-range {}

input[type="checkbox"],
input[type="radio"] {
	margin: 0.5rem 0 0;
	opacity: 0;
	padding: 0;
}

input[type="checkbox"] + label,
input[type="radio"] + label {
	background: url(../image/checkbox.png) no-repeat scroll left center transparent;
	background-image: url(../image/checkbox.svg);
	-webkit-background-size: 15px 15px;
	background-size: 15px 15px;
	display: inline-block;
	line-height: 15px;
	margin-left: -18px;
	padding-left: 22px;
}

input[type="checkbox"]:checked+label {
	background-image: url(../image/checkbox--checked.png);
	background-image: url(../image/checkbox--checked.svg);
	-webkit-background-size: 16px 15px;
	background-size: 16px 15px;
}

input[type="radio"]+label {
	background-image: url(../image/radio.png);
	background-image: url(../image/radio.svg);
}

input[type="radio"]:checked+label {
	background-image: url(../image/radio--checked.png);
	background-image: url(../image/radio--checked.svg);
}

/* White on Black */
.theme--dark {
	--label-font-color: white;
}

.theme--dark input[type="checkbox"]+label,
.theme--dark input[type="radio"]+label {
	background-image: url(../image/checkbox-white.png);
	background-image: url(../image/checkbox-white.svg);
}

.theme--dark input[type="checkbox"]:checked+label {
	background-image: url(../image/checkbox-white--checked.png);
	background-image: url(../image/checkbox-white--checked.svg);
}

.theme--dark input[type="radio"]+label {
	background-image: url(../image/radio-white.png);
	background-image: url(../image/radio-white.svg);
}

.theme--dark input[type="radio"]:checked+label {
	background-image: url(../image/radio-white--checked.png);
	background-image: url(../image/radio-white--checked.svg);
}
