:root {
    --input-field-border-radius  : var(--site-radius);
    --input-form-wrapper-border-radius  : var(--site-radius);
    --input-form-button-normal : #008cbb;
    --input-form-button-hovered : #00ae00;
    --input-form-button-selected : #09c1ff;
}

.input-form-background-blocker {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color : rgba(0, 0, 0, .2);
    z-index: 25001;
}

.input-form-background-blocker.show-background {
    display: inline-block;
}


.input-form-message-box-background-blocker {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color : rgba(0, 0, 0, .2);
    z-index: 25003;
}

.input-form-message-box-background-blocker.show-background {
    display: inline-block;
}


.input-form-message-box {
    display : none;
    position : fixed;
    top : 50%;
    left : 50%;
    -webkit-transform : translate(-50%, -50%);
    transform : translate(-50%, -50%);
    background : #f9f9f9;
	box-shadow : 5px 5px 10px 0.9px rgba(0, 0, 0, 0.5);
	border : 1px solid #ffffff;
	border-radius : 3px;
	border-radius : var(--input-form-wrapper-border-radius);
    margin : 0 auto;
    padding : 30px 30px 30px 30px;
    text-align : center;
    z-index : 25004;
    transition : all .6s;
}

.input-form-message-box.show-message-box {
    display : inline-block;
}

.input-form-message-box-inner {
	display : inline-block;
	width : 100%;
	border : 0px;
	margin : 0px;
    background-color : #ffffff;
	vertical-align : top;
}

.input-form-message-box-line {
	width : 100%;
	text-align : center;
	font-size : 10pt;
	color : #000000;
	margin : 10px 10px 10px 10px;
}

.input-form-message-box-space-Line {
	width : 100%;
	height : 40px;
}

.input-form-message-box-button-line {
	display : inline-block;
	width : 100%;
	text-align : center;
	vertical-align : top;
	padding : 10px 30px 10px 10px;
}


.input-form-heading-text {
	display : inline-block;
	width : 100%;
	text-align : center;
	font-size : 1.1rem;
	font-weight : 600;
	margin-top : 5px;
    background-color : #f2f2f2;
    border-radius : 3px;
    border-radius : var(--site-radius);
}



.input-field-checkbox-wrapper {
	display : inline;
	color : white;
	margin-right : 5px;
    margin-left : 5px;
}

.input-field-checkbox {
    transform: scale(1.5);
}

.input-field-checkbox-label {
	display : inline;
}


.input-form-wrapper {
	position : relative;
	padding : 10px 10px 10px 10px;
	border-radius : 3px;
	border-radius : var(--input-form-wrapper-border-radius);
	z-index : 50;
	background-color : var(--main-brand);
}

.input-field-legend, .input-field-legend-left, .input-field-legend-center {
	display : inline-block;
	width : 100%;
	text-align : right;
	height : 23px;
	font-size : 1rem;
	font-weight : 600;
	margin : 3px 0px 0px 4px;
}

.input-field-legend-left {
	text-align : left;
}

.input-field-legend-center {
	text-align : center;
}


.light-input-field-legend-text-colour 
{
	color : white;
}

.light-form-heading-text-colour
{
	color : white;
}

.light-form-input-field-checkbox-label-colour
{
	color : #005f8c;
	color : var(--main-brand);
}

.light-form-input-form-links 
{
	color : #00ae00;
}

.light-form-input-form-links:hover 
{
    color : #0000ff;
}



.dark-input-field-legend-text-colour
{
	color : #005f8c;
	color : var(--main-brand);
}

.dark-form-heading-text-colour
{
    color : #005f8c;
	color : var(--main-brand);
}

.dark-form-input-field-checkbox-label-colour
{
	color : #005f8c;
	color : var(--main-brand);
}

.dark-form-input-form-links 
{
	color : #00ae00;
}

.dark-form-input-form-links:hover 
{
    color : #0000ff;
}


.grey-panel
{
	padding : 5px;
	background-color : #006a9d;
	border-radius : 3px;
	border-radius : var(--site-radius);
	
}

.grey-panel-text { color : #ffffff;}

.input-field-text-single-line, .input-field-text-single-line-Ucase, .input-field-text-single-line-bold {
	display : inline-block;
	width : 100%;
	height : 28px;
	background-color : #f9f9f9;
	border : 1px solid #c0c0c0;
	outline : none;
	padding : 0px 12px 0px 12px;
	margin : 0px 0px 3px 0px;
	font-size : 14px;
	color : #787878;
	border-radius : 3px;
	border-radius : var(--input-field-border-radius);
}


.input-form-legend 
{
	display : inline-block;
	color : white;
	font-size : 1.1rem;
	padding : 10px 0px 10px 0px;
}

.input-field-text-single-line-bold
{
	font-weight : 700;
	font-size : 1.2rem;
}

.input-field-text-single-line-Ucase {
   text-transform : uppercase;
}


.input-field-text-multi-line {
	display : inline-block;
	width : 100%;
	height : 70px;
	background-color : #efefef;
	border : 2px solid #c0c0c0;
	margin : 0;
	padding : 5px 0px 0px 13px;
	font-size : 14px;
	color : #787878;
	resize : none;
	outline : none;	
	vertical-align : center;
	border-radius : 3px;
	border-radius : var(--input-field-border-radius);
}


.input-field-text-multi-line:focus, .input-field-text-single-line:focus, .input-field-text-single-line-Ucase:focus, .input-field-text-single-line-bold:focus {
    background-color : white;
}

.input-field-text-multi-line:disabled, .input-field-text-single-line:disabled, .input-field-text-single-line-Ucase:disabled, .input-field-text-single-line-bold:disabled {
    background-color : #bdd9ee;
}
	
	
.input-form-hidden-action-button {
	visibility : hidden;
}

.input-field-radio {
	    margin-top : 11px;
	    transform: scale(1.5);
}

.input-form-action-button, .input-form-hidden-action-button, .input-form-action-button-slim 
{ 
	padding : 10px;
    color : white;
    font-size : 1.1rem;
    font-weight : 600;
    background-color : #008cbb;
    background-color : var(--input-form-button-normal);
    transition : background-color .3s;
    border-radius : 3px;
 	border-radius : var(--input-field-border-radius);
 	outline : none;
    border : none; 
    margin : 3px;
    min-width : 160px;	
}


.input-form-action-button-red 
{ 
	padding : 10px;
    color : white;
    font-size : 1.1rem;
    font-weight : 600;
    background-color : #ff0000;
    transition : background-color .3s;
    border-radius : 3px;
 	border-radius : var(--input-field-border-radius);
 	outline : none;
    border : none; 
    margin : 3px;
    min-width : 160px;	
}


.input-form-action-button-red:hover
{
    background-color : #ce0000;
	cursor : pointer;
}

.input-form-action-button-large-main
{ 
	padding : 10px;
    color : white;
    font-size : 1.5rem;
    font-weight : 700;
    background-color : var(--input-form-button-normal);
    transition : background-color .3s;
    border-radius : 3px;
 	border-radius : var(--input-field-border-radius);
 	outline : none;
    border : 8px solid var(--input-form-button-hovered);
    margin : 3px;
    padding : 10px;
    min-width : 160px;	
}

.input-form-action-button-large-main:hover
{
	background-color : var(--input-form-button-hovered);
	cursor : pointer;
}


.input-form-action-button-slim
{
	font-size : .9rem;
    font-weight : 400;	
	padding : 1px 3px 1px 3px;
	margin-bottom : 3px;
    min-width : 0px;	
}

.input-form-action-button:hover, .input-form-hidden-action-button:hover, .input-form-action-button-slim:hover 
{
    background-color : #00ae00;
	background-color : var(--input-form-button-hovered);
	cursor : pointer;
}
 
.input-form-action-button:focus, .input-form-hidden-action-button:focus, .input-form-action-button-slim:focus {
	outline : none;
}

.input-form-action-button-selected, .input-form-hidden-action-selected { 
    padding : 10px;
    color : white;
    font-size : 1.1rem;
    font-weight : 600;
    background-color : #09c1ff;
    background-color : var(--input-form-button-selected);
    transition : background-color .3s;
    border-radius : 3px;
 	border-radius : var(--input-field-border-radius);
 	outline : none;
    border : none; 
    margin : 3px;
    min-width : 160px;	
}


.input-form-action-button-selected:hover, .input-form-hidden-action-button-selected:hover {
    background-color : #09c1ff;
	background-color : var(--input-form-button-selected);
	cursor : pointer;
}
 
.input-form-action-button-selected:focus, .input-form-hidden-action-button-selected:focus {
	outline : none;
}




.inputfile-up {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

.inputfile-up + label {
    font-size: 1.1rem;
    color: white;
    background-color : #00b700;
    padding : 20px 12px 20px 12px;
    display: inline-block;
    border-radius : 3px;
    border-radius : var(--site-radius);
    border : 6px solid #0080ff;
    text-align : center;

}

.inputfile-up + label:hover {
	background-color : #009100;
}

.inputfile-up + label {
	cursor: pointer; /* "hand" cursor */
}



.inputfile {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

.inputfile + label {
    font-size: 1.1rem;
    color: white;
    background-color : #008cbb;
    background-color: var(--input-form-button-normal);
    padding : 20px 12px 20px 12px;
    display: inline-block;
    border-radius : 3px;
    border-radius : var(--site-radius);
    text-align : center;

}

.inputfile + label:hover {
	background-color : #00ae00;
    background-color: var(--input-form-button-hovered);
}

.inputfile + label {
	cursor: pointer; /* "hand" cursor */
}


input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
}

@media only screen and (max-width: 992px) {

	.order-form-cart-row-wrapper
	{
	   font-size : .8rem;
	}
}

@media only screen and (max-width: 768px) {

}
	
@media only screen and (max-width: 576px) {

	
    .input-field-legend {
        text-align : left;
    }
    
    
}

