/**
 * Forms styles 
 * -----------------------------------------------------------------------------
 */
 
 /* for grid */
.has-form,
.grid-1.has-form{ margin:0 auto; padding:0; }

.kcform{
margin:0 auto; padding:0;
width:auto; height:100%;
font:normal 16px MuseoSans-100, Arial, Helvetica, sans-serif;
color:#989898; clear:both; line-height:20px;
}

/**
 * Layout
 * --------------------------------
 */	
.has-form section{ margin:0 auto 30px; } /* separate forms */

.kcform .with-icon input[type=text]{
width:95%; /* 855 / 900 */
float:left;  
}
.kcform fieldset,
.kcform .row, 
.kcform .field{
margin:0 auto; padding:0;
width:auto; height:100%;
}  	
	.kcform .row{ margin:0 auto 8px; }
	.kcform .half, 					  /* half of the full width */
	.kcform .qtr{ width:48%; } /* quater of the full width, half of the half width*/
    .kcform .halfqtr{ width:24%; } /* half of the quater width*/
	.kcform .third { width: 30% }
/* half of the quarter width */
	.kcform .is-xs{ width:23.6111%; margin:0 4px; float:left;}  
	.kcform .is-xs.has-label label{ text-align:right; }  
	.kcform .is-xs:first-child{ width:23.6111%; margin-left:0; float:left; }  
	.kcform .is-xs:last-child{ width:23.6111%; margin:0; float:right; }   

/**
 * Specific Contents - text, links
 * -----------------------------------------------------------------------------
 */
.kcform .error,
.kcform .note{ 
margin:0 auto; padding:5px 10px; 
display:block; clear:both;
font:normal 12px/16px MuseoSans-300, Arial, Helvetica, sans-serif; 
}	
	.kcform .error{ color:#c00; }
	.kcform .note{ color:#8e8e8e; }	
	.kcform .note.sm{ padding:5px 0; line-height:12px; }
    .kcform .note.error{ color:#c00; font-weight: bold; }
    .kcform .field.with-arrow {
        position: relative
    }
    .kcform .field.with-arrow .fa-arrow-right {
        color: black;
        position: absolute;
        left: -20px;
        top: 8px;
    }
    .kcform .field.with-arrow .fa-arrow-right.arrow-error {
        color: #c00;
    }

.kcform .msg{ 
margin:5px auto; padding:0; 
display:block; clear:both;
font:normal 14px/18px MuseoSans-300, Arial, Helvetica, sans-serif; 
color:#8e8e8e;  
}
.kcform .msg.red{
    color:#c00;
}

.kcform .retire{
margin:0px 10px; cursor: pointer;
font:12px "MuseoSans-300", Arial, Helvetica,sans-serif;
color: #aaa; vertical-align: middle;
}
	.kcform .retire:hover{ color:#07a7e0; }
	
/**
 * Progress Spinner 
 * -------------------------------- 
 */
.has-form .with-spinner img.spinner {
position: relative;
top:2px;
display:none;
margin-left: 5px;
}

/**
 * Form titles - inside .kcform
 * -----------------------------------------------------------------------------
 */
/* .kcform h4{
margin:0 0 15px 0; padding:0 0 5px 0;
border-bottom:1px solid #393939; 
}*/
.kcform h4 img.spinner {
position: relative; top:2px; display:none;
}
	
	
/**
 * Buttons inside the forms
 * -----------------------------------------------------------------------------
 */

/**
 * Buttons: Layout
 * --------------------------------
 */
.kcform .field.for-btn,
.kcform .for-btn{
margin-bottom:20px;
}
	.kcform .field > .for-btn{
	margin:20px auto;
	}
	/* buttons side by side */
	.kcform .field > .for-btn.inline a,
	.kcform .field > .for-btn.inline input[type=submit],
	.kcform .field > .for-btn.inline input[type=reset],
	.kcform .field > .for-btn.inline button{
	margin-bottom:5px;
	}

.kcform .input-group {
	position: relative;
	display: table;
	border-collapse: separate;
}

.kcform .input-group .input-group-addon {
	display: table-cell;
	padding: 5px 10px;
	font-weight: 400;
	line-height: 1;
	color: #555;
	text-align: center;
	background-color: #F3F3F3;
	border: 1px solid #989898;
	width: 1%;
	white-space: nowrap;
	border-right: 0;
}

.kcform .input-group .input-group-addon-right {
	display: table-cell;
	padding: 5px 10px;
	font-weight: 400;
	line-height: 1;
	color: #555;
	text-align: center;
	background-color: #F3F3F3;
	border: 1px solid #989898;
	width: 1%;
	white-space: nowrap;
	border-left: 0;
}

.kcform .input-group .input-group-addon-right.currency {
	width: 75px;
}

.kcform .field.field-claim-code {
        margin: 0 auto 0;
        width: 50%;
}

.kcform .input-group.input-claim-code {
        width: 14em;
}

/**
 * Form elements color: border, placeholder, focus

	colors 
	- default blue : #00a8e0
	- black          : #5b5c5c
	- gray           : #989898, #ddd
* -----------------------------------------------------------------------------
*/	
.kcform .form-blue input, 
.kcform .form-blue textarea{ border:1px solid #00a8e0; }

.kcform .form-black input,
.kcform .form-black textarea{ border:1px solid #5b5c5c; }

.kcform .form-gray input,
.kcform .form-gray textarea{ border:1px solid #989898; }

.kcform ::-webkit-input-placeholder,
.kcform :-moz-placeholder, /* Firefox 18- */
.kcform ::-moz-placeholder, /* Firefox 19+ */
.kcform :-ms-input-placeholder {  
color:#ddd; 
}
.kcform [placeholder]:focus::-webkit-input-placeholder,
.kcform [placeholder]:focus:-moz-placeholder, /* Firefox 18- */
.kcform [placeholder]:focus::-moz-placeholder, /* Firefox 19+ */
.kcform [placeholder]:focus:-ms-input-placeholder {  
color:#ddd; 
transition: opacity 0.5s 0.5s ease; 
-ms-filter: "alpha(opacity=0)";
filter: alpha(opacity = 0);
opacity:0;
}
.kcform input[type=text]:focus {
outline:none !important;
border:1px solid #00a8e0;
}
	

/**
 * Form inputs: text, email, password
 * Form textarea
 * -----------------------------------------------------------------------------
 */	
.kcform input[type="text"],
.kcform input[type="email"],
.kcform input[type="password"],
.kcform input[type="tel"],
.kcform input[type="number"],
.kcform textarea{
padding:5px 10px; width:100%;  
-webkit-box-sizing:border-box; 
-moz-box-sizing:border-box; 
box-sizing:border-box;
}

/**
 * full field has inline elements only
 * --------------------------------
 */
.kcform .field.has-inline .field,
.kcform .field.has-inline input[type="text"],
.kcform .field.has-inline label,
.kcform .field.has-inline .half,
.kcform .field.has-inline .qtr{ display:inline-block; }

.kcform .field.has-inline .half{ width: 50%; }
.kcform .field.has-inline .qtr { width: 25%; }

.kcform .field.has-inline input[type="text"]{ width:100%; }
.kcform .field.has-inline label{ width:auto; }
.kcform .field.has-inline .for-btn{ 
margin:3px auto 0; display:inline-block; 
vertical-align:top;
}
	
	
/**
 * set or rows of fields has inline elements
 * --------------------------------
 */	
.kcform .rows-inline{
width:100% !important; 	
}	
.kcform .rows-inline .field{
margin:0 10px 10px 0; display:inline; float:left; 
}		
	
	.kcform .rows-inline label{
	line-height:30px; width:25px; 
	display:inline-block;
	}
	.kcform .rows-inline label.to{ width:15px !important; } 
	.kcform .rows-inline .field.half{ width:35%; }


/**
 * Input has labels
 * --------------------------------
 */
.kcform .has-label label{ 
font:14px MuseoSans-500, Arial, Helvetica, sans-serif;
color:#989898; line-height:30px;  display:inline-block;
}
.kcform .has-label label.t-right{ margin-right:5px; }

/* field */
.kcform .has-label label,
.kcform .has-label input[type="text"],
.kcform .has-label input[type="email"],
.kcform .has-label input[type="password"],
.kcform .has-label input[type="tel"],
.kcform .has-label .dropdown{ width:100%; }

/* any text as label */
.kcform .as-label{ 
margin:0; padding:0; vertical-align:top;
font:16px MuseoSans-500, Arial, Helvetica, sans-serif;
color:#989898; line-height:30px; display:inline-block;
}
	
/**
 * Inputs: with icon
 * --------------------------------
 */	
.kcform .with-icon input[type=text]{
width:95%; /* 855 / 900 */
float:left;  
}
	.kcform .with-icon.half input[type=text]{
	width:90.278%; /* 390 / 432 */
	float:left; 
	}
	.kcform .with-icon.qtr input[type=text]{
	width:82.1256038647343%; /* 170 / 207 */
	float:left; 
	}
	
/**
 * Inputs: with icon inside input
 * --------------------------------
 */			
.kcform .with-icon.inner{
position:relative;
}
.kcform .with-icon.inner input[type=text]{
width:100%;  
}	
	.kcform .with-icon.inner .icon{
	position:absolute; top:0; right:5px; 
	}
		.kcform .with-icon.inner .icon span{
		text-indent:-9999px; display:inline-block;
		}
		
/**
 * Inputs: with group of icons
 * --------------------------------
 */		
.kcform .with-icon.grp .cc-card{
width:72.77778%; /* 655 / 900 */
float:left; 
}	
.kcform .with-icon .icon-grp {	
margin:0; padding:3px 0 0 0; 
width:23.88889%; /* 215 / 900 */
float:right; list-style:none;
}	
	.kcform .with-icon .icon-grp li {
	margin-left:5px; float:left;		
	}
/* inside half */	
.kcform .with-icon.grp.half .cc-card{ width:69.44444%; /* 300 / 432 */ }
.kcform .with-icon.half .icon-grp {	width:30.09259%; /* 130 / 432 */ }

/* specific: inside a .grid-2.col2 */
.has-form.grid-2.col-2 .kcform .with-icon.grp .cc-card{
width:67.41573033707865%; /* 300 / 445 */
}	
.has-form.grid-2.col-2 .kcform .with-icon .icon-grp {	
width:29.213483146067415%; /* 130 / 445 */
}	


/**
 * Inputs: icons used * --------------------------------
 */	
.kcform .with-icon .calendar{	
background:url(LXHcE4OXim89V4kFD3WhMHbwYgnWMyx79uHFkEFnbsG.png) no-repeat -150px 0;
width:27px; height:27px; float:right;
}
.kcform .with-icon .globe{	
background:url(2zGmxgdFJkDXM47IwLjanKOeaiusF1MjXB7KEmlXm9t.png) no-repeat 0 50%;
width:20px; height:30px; float:right;
}
.kcform .with-icon .search{	
background:url(ZthAyZiN3pCMuF5mcLpmXBDKg4ANzKfznydAvMkIkzy.png) no-repeat 0 50%;
width:20px; height:30px; float:right;
-webkit-background-size:80%;
-moz-background-size:80%;
-ms-background-size:80%;
background-size:80%;
}
.kcform .with-icon .pickup,
.kcform .with-icon .dropoff{
width:50px; height:30px; display:inline-block;
}
	.kcform .with-icon .pickup{
	background:url(iSHjl3KBQxKjmBbIKvaYX2DuNbHGxQ5GDxigEuLjuqi.png) no-repeat 0 -60px;
	background-size:30px;
	}
	.kcform .with-icon .dropoff{
	background:url(iSHjl3KBQxKjmBbIKvaYX2DuNbHGxQ5GDxigEuLjuqi.png) no-repeat 0 -120px;
	background-size:30px;
	}

/* Info icons */

.row.with-info {
    position: relative;
}

.row.with-info .ico-info {
    position: absolute;
    top: -4px;
    right: -35px;
}

/**
 * Input: phone number, mobile number
 * -----------------------------------------------------------------------------
 */
.kcform .tel{ margin-left:-15px; } 
	.kcform .tel .plus{ width:15px; float:left; line-height:30px; }
        .kcform .tel .plus.read-only{ width:15px; float:left; line-height:20px; }
    .kcform .tel .area{
	width:22.22%; /* 200 / 900 */
	float:left; 
	} 
	.kcform .tel .phone{ 
	width:72.77778%; /* 655 / 900 */
	float:right; 
	}

/* inside half */
.kcform .tel.half{ width:49.66667%; /* 447 / 900 */ }
.kcform .tel.half .phone{
width:72.77778%; /* 655 / 900 */
float:right;
}
	
/* text */	
.kcform .tel .error,
.kcform .tel .note,
.kcform .tel .msg{ padding-left: 25px; text-align:left; } 


 /**
 * Input: type file (upload)
 * -----------------------------------------------------------------------------
 */
.kcform .has-upload{ display:block; } 
.kcform .has-upload + .for-btn{ clear:both; } 

.kcform input[type=file],
.kcform .custom-file-input {
background:transparent; 
position:relative; top:0;
padding:3px 0 2px;
width:100%; line-height:20px;
color:#ddd; vertical-align:middle; 
border:1px solid #00a8e0;
-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none;
}
	.kcform input[type=file]{ border:0; }
	
.kcform .custom-file-input::-webkit-file-upload-button {
visibility: hidden;
}
.kcform .custom-file-input::before {
position:absolute; top:0;
content:'Select File';
padding:5px 10px;
display:inline-block;
outline:none; cursor:pointer;
white-space: nowrap;
-webkit-user-select: none; 
} 
.kcform .custom-file-input:hover::before {
background:#424242; color:#fff;
}
.kcform .custom-file-input:active {
outline: 0;
}
.kcform .custom-file-input:active::before {
background: none;
}

/* form colors */
.kcform .form-blue .custom-file-input::before { background:#00a6df; color:#fff; }
.kcform .form-blue .custom-file-input { border:1px solid #00a8e0; }

.kcform .form-black .custom-file-input::before { background:#5b5c5c; color:#fff; }
.kcform .form-black .custom-file-input { border:1px solid #5b5c5c;  }

.kcform .form-gray .custom-file-input::before { background:#989898; color:#fff; }
.kcform .form-gray .custom-file-input { border:1px solid #989898; }
.kcform .form-gray .label-black {color: black}
  
/**
 * Read-only form inputs, dropdown
 * --------------------------------
 */
 .kcform .readonly{ margin:0; color:#989898; }
 .kcform .readonly .field{ margin:0;  }
 
.kcform input[type="text"]:-moz-read-only,
.kcform input[type="email"]:-moz-read-only,
.kcform input[type="password"]:-moz-read-only,
.kcform input[type="tel"]:-moz-read-only{
background:none; border:0; padding:0;
color:#989898;
}

.kcform  input[read-only],
.kcform  input[read-only=readonly],
.kcform input[type="text"]:read-only,
.kcform input[type="text"]:read-only,
.kcform input[type="text"]:read-only,
.kcform input[type="email"]:read-only,
.kcform input[type="password"]:read-only,
.kcform input[type="tel"]:read-only{
background:none; border:0;  padding:0;
color:#989898;
}

.kcform .readonly .tel{ margin:0; }

.kcform .readonly .tel  .plus{ line-height:25px; }
.kcform .readonly .tel  .plus,
.kcform .readonly .tel  .phone,
.kcform .readonly .tel .area{ float:left; display:inline; /* height:20px; */} 
.kcform .readonly .tel  .plus,
.kcform .readonly .tel .area{ width:20px; } 

/* Dropdown */
.kcform .read-only.dropdown{ 
background:none;
margin:0; height:20px; 
line-height:20px; vertical-align:middle;
}
.kcform .read-only.dropdown .trigger{	
background:none; padding:0; 
border:0; color:#989898; 
}
.kcform .read-only.dropdown .trigger.selected{ color:#989898; }
.kcform .read-only.dropdown .trigger:after,
.kcform .read-only.dropdown .options{	
display:none;
}

/**
 * Disable form inputs
 * --------------------------------
 */
.kcform input[type="text"]:disabled,
.kcform input[type="email"]:disabled,
.kcform input[type="password"]:disabled,
.kcform input[type="tel"]:disabled,
.kcform .radio input[type="radio"]:disabled + label,
.kcform .checkboxes input[type="checkbox"]:disabled + label,
.kcform .checkboxes input[type="checkbox"]:disabled + label span,
.kcform .textarea textarea:disabled{
cursor:not-allowed; opacity:0.5;
}
		 
/**
 * Dropdown: <ul> styled as dropdown 
 * -----------------------------------------------------------------------------
 */
.kcform .dropdown{
position:relative; height:30px;
}	
	.kcform .dropdown .trigger{	
	background:#fff; min-height:15px; 
	margin:0; padding:5px 10px;
	display:block; color:#989898;  
	border: 1px solid #989898; 
	text-align:left; cursor:pointer;
	text-decoration:none;  
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
    max-height: 20px;
    overflow: hidden;
	}
        .kcform .dropdown .trigger.selected {
        color:#000000
        }
		/* blue borders */
		.kcform .form-blue .dropdown .trigger{
		border:1px solid #00a8e0;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;			
		}
		/* black borders */
		.kcform .form-black .dropdown .trigger{
		border:1px solid #5b5c5e;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;			
		}
    .kcform .dropdown.read-only .trigger{
    cursor: inherit;
    }
    .kcform .dropdown.disabled .trigger{
    cursor: not-allowed;
    }
		/*triangle arrow*/
		.kcform .dropdown .trigger:after {
		content: ""; position:absolute; 
		top:20px; right:0; width:0; height:0;
		border-bottom:12px solid #383939;
		border-left:12px solid rgba(0, 0, 0, 0);
		}
		/* blue triangle arrow*/
		.kcform .form-blue .dropdown .trigger:after{
		border-bottom:12px solid #00a8e0;	
		}	
		/* black triangle arrow*/
		.kcform .form-black .dropdown .trigger:after{
		border-bottom:12px solid #5b5c5c;	
		}		
		
        .kcform .dropdown.read-only .trigger:after {
        content:none;
        }
	.kcform .dropdown .options{
	background:#f8f8f8;  position:relative;
	margin:0; padding:0; width:auto; list-style:none;	
	max-height:200px; overflow:auto;
	visibility:hidden; height:0;
	border-left:1px solid #989898;
	border-right:1px solid #989898;
	border-bottom:1px solid #989898;
	}	
	    .kcform .dropdown.disabled .options{
		max-height:0; border:0;
		}
		/* blue borders */
		.kcform .form-blue .dropdown .options{
		border-left:1px solid #00a8e0;
		border-right:1px solid #00a8e0;
		border-bottom:1px solid #00a8e0;	
		}
		/* black borders */
		.kcform .form-blue .dropdown .options{
		border-left:1px solid #5b5c5e;
		border-right:1px solid #5b5c5e;
		border-bottom:1px solid #5b5c5e;
		}
		.kcform .dropdown .options li{
		margin:0; padding:5px 10px; text-align:left; 
		display:block; clear:both; line-height:16px;
		cursor:pointer; z-index:10; 
		}	
			.kcform .dropdown .options li > a{ 
			color:#989898; text-decoration:none; 
			}

.kcform .dropdown .options li.hint {
	cursor: default;
	color: #b4b4b4;
}

.kcform .dropdown .options li:not(.hint):hover {
	margin: 0;
	padding: 5px 10px;
	text-align: left;
	background: #dedede;
}

	.kcform .dropdown .active{ visibility:visible; height:auto; z-index:10; }
    .kcform .dropdown.disabled { opacity: 0.5; }
    
/**
 * Checkboxes: no-js implementation
 * -----------------------------------------------------------------------------
 */
.kcform .checkboxes{	
margin:0 auto; padding:0;
}
	/* Account Settings > Notification */
	.kcform .checkboxes.notif p{ text-align:center; }
	.kcform .checkboxes label{ 
	margin:0; padding:5px 0; line-height: 30px;
	}
	.kcform .checkboxes label.t-sm{ font-size:14px; }
		.kcform .checkboxes input[type=checkbox]{ 
		margin:0; padding:0; float:left;  
		display:none;
		}
		.kcform .checkboxes input[type=checkbox] + label span{
		background:url(iSHjl3KBQxKjmBbIKvaYX2DuNbHGxQ5GDxigEuLjuqi.png) no-repeat -9px -519px;		
		margin:0; padding:0; width:40px; height:30px; display:inline-block;		
		vertical-align:middle; cursor:pointer;
		}
		.kcform .checkboxes input[type=checkbox]:checked + label span{
		background:url(iSHjl3KBQxKjmBbIKvaYX2DuNbHGxQ5GDxigEuLjuqi.png) no-repeat -9px -485px;				
		}		
		.kcform .checkboxes label + .ico-info.more-info{
		 position:relative; top:-13px;  left:0; 
		}
			.kcform .field.more-info-details p{ margin:0 0 10px 0; }
            .kcform .field.info-details.below-field{ margin:20px 0 10px 0; }
			
		/* smaller checkbox */
		.kcform .has-chkbox-sm .field.half{ width:45%; }
		.kcform .checkboxes.sm label{ 
		font:normal 12px MuseoSans-300, Arial, Helvetica, sans-serif;
		}	
		.kcform .checkboxes.sm input[type=checkbox] + label span{
		background:url(iSHjl3KBQxKjmBbIKvaYX2DuNbHGxQ5GDxigEuLjuqi.png) no-repeat -13px -579px;		
		margin:0; padding:0; width:30px; height:20px; display:inline-block;		
		vertical-align:middle; cursor:pointer;
		}
		.kcform .checkboxes.sm input[type=checkbox]:checked + label span{
		background:url(iSHjl3KBQxKjmBbIKvaYX2DuNbHGxQ5GDxigEuLjuqi.png) no-repeat -13px -556px;				
		}				

/**
 * Radio
 * -----------------------------------------------------------------------------
 */
.kcform .radio { height:auto; }
.kcform .for-radio{ margin:0; line-height:30px; }
.kcform .radio .radio-item {
padding:0 10px 0 5px; 
display:inline-block;
line-height:30px;
}
	.kcform .radio .radio-item.block { 
	display:block; clear:both; 
	}
	.kcform .radio input[type=radio] {	display:none; /* hide it */ }
		.kcform .radio input[type=radio] + label {
		padding-left:30px; display:inline-block;
		height:22px; line-height:22px;  
		vertical-align:middle; cursor:pointer;
		}
		.kcform .radio input[type=radio]:checked + label {
		background:url(L8BH0vc7USxImMS24l7VHo4YmWTZiEXESSqET9GFfuh.png) no-repeat 0 0;
		}
		.kcform .radio label {
		background:url(L49sTvUhjDvahAB1fVanD2ufJOQNuLX1nMTM2DAbk6U.png) no-repeat 0 0;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		-khtml-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		}
			
			
/**
 * Tooltips
 * -----------------------------------------------------------------------------
 */
.kcform .tooltip{
margin:3px 0 0; padding:0;
position:relative; display:inline-block;
font:12px 'MuseoSans-300', Arial, Helvetica, sans-serif;
line-height:16px; list-style:none;
}
	/* position */
	.kcform .tooltip.left-tooltip {
	margin-right:5px; float:left;	
	}
	.kcform .tooltip.right-tooltip {
	margin-left:5px; float:none;
	}
	.kcform .tooltip.bottom-tooltip {
	margin-left: 5px;
	float:none; 
	}	
	/* elements */
	.kcform .tooltip li{ position:relative; }
	.kcform .tooltip a{
	background: url(LXHcE4OXim89V4kFD3WhMHbwYgnWMyx79uHFkEFnbsG.png) no-repeat -240px 0;
	margin-top:2px; width:11px; height:11px; display:block;
	text-indent:-9999px; overflow:hidden;
	}
        .kcform .tooltip a.text{
        background: none; margin-top:0px; width:auto; height:auto; text-indent:0px; overflow:visible;
        }
	/* arrow */
	.kcform .tooltip .arrow{
	content:''; 
	background: url(LXHcE4OXim89V4kFD3WhMHbwYgnWMyx79uHFkEFnbsG.png) no-repeat -240px -15px;
	width:8px; height:11px;
	position:absolute; top:-1px; left:14px; 
	z-index:99; display:none;
	}
		.kcform .tooltip .arrow.bottom{
		background: url(LXHcE4OXim89V4kFD3WhMHbwYgnWMyx79uHFkEFnbsG.png) no-repeat -284px -103px; 
		top: 18px; left:0;
		-webkit-transform: rotate(90deg);
		-moz-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		-o-transform: rotate(90deg);
		transform: rotate(90deg);
		}
		.kcform .tooltip .hover .arrow{display:block;}		
	/* popup */
	.kcform .tooltip .popup{
	background:#f1f1f2; display:none; z-index:98;
	padding:10px 11px; width:212px;	
	position:absolute; top:-34px; left:20px;	
	font-size:0.917em; color:#404041; line-height:1.364em;	
	border:1px solid; border-radius:5px;
	border-color:#9ed6eb #436f81 #587784 #68b7d6;		
	-webkit-box-shadow:inset -1px 0 0 0 #b6deed, inset 0 -1px 0 0 #9ed6eb, 1px 1px 0 0 #a8bac3;
	-moz-box-shadow:inset -1px 0 0 0 #b6deed, inset 0 -1px 0 0 #9ed6eb, 1px 1px 0 0 #a8bac3;
	box-shadow:inset -1px 0 0 0 #b6deed, inset 0 -1px 0 0 #9ed6eb, 1px 1px 0 0 #a8bac3;	
	}
		.kcform .tooltip .popup.bottom{ top:25px; }
		.kcform .tooltip .popup p{ margin:0; }
		.kcform .tooltip .popup.bottom p{ margin:0; padding:0; }
		.kcform .tooltip .hover .popup{ display:block; }
		
/**
 * form inside secure form: +Access
 * -----------------------------------------------------------------------------
 */	
.switch-options .field.has-show-oncheck{
position:relative;
}
   .switch-options .field.date .date-wrapper .hasDatepicker{
    width:82.9268%;
    }	
 
.switch-options .field#reminder-time{ height:40px;  }

/*** Guest Registration form */	
#guest-register h4{
margin:0 auto; padding:0; border:0;
line-height:34px;
}
	.icon-padlock{ 
	margin:5px 2px -2px 5px; display:inline-block;
	width:21px; height:21px;
	background:url('mLK5FtVisJ1tl1A494bzlUl3GjCWhZaFaM6bmHhVpha.png') no-repeat scroll -284px -219px transparent;	
	}
	.icon-paper{
	background:url(mYwTZpSh4AI7LPMV6smKaSj570uZkl6nH9JQmfftx0R.png) no-repeat -16px -1850px;
	width:30px; height:30px; display:inline-block; float:left;
	}
#guest-register .user-email { height:30px;}
#guest-register .user-email  #email{ 
width:85%; float:left;
font: 16px/24px 'MuseoSans-500', Arial, Helvetica, sans-serif;
color: #3a3a3a;
}

/* New Access form */

.new-access-form #comments {
	height: 105px;
}

.new-access-form .switch-item {
	margin-top: 20px;
}

.new-access-form .radio.mobile-email-radio label,
.new-access-form .radio.mobile-email-radio label {
	background: url(L49sTvUhjDvahAB1fVanD2ufJOQNuLX1nMTM2DAbk6U.png) no-repeat 0 0;
}

.new-access-form .checkboxes label + .ico-info.more-info {
	top: 0;
	height: 18px;
	background-position: 0 -794px;
}

.new-access-form .info {
	text-align: left;
}

.new-access-form .show-more {
	text-decoration: underline;
	color: #999;
}

.new-access-form .submit-new-access {
	margin-bottom: 15px;
}

/*** New Key/Edit Key forms ***/
#new-key-form .ico-info.more-info,
.kcform.edit-key-form .checkboxes label + .ico-info.more-info {
	top: 0;
	height: 18px;
	background-position: 0 -794px;
}

#new-key-form .more-info-details,
.edit-key-form .more-info-details,
.edit-key-form .row.info {
	margin-top: 10px;
}

.edit-key-form .pickup-note-enabled-field {
	margin-top: 15px;	
}

#new-key-form #pickup-note-enabled-field {
	margin-top: 15px;
}

.edit-key-form .edit-serial-number {
	margin-left: 10px;
}

/*** Billing change plan ***/

#billing-form .card-status i {
	background: url('mLK5FtVisJ1tl1A494bzlUl3GjCWhZaFaM6bmHhVpha.png') no-repeat -285px -426px;
	width: 20px;
	height: 25px;
	float: left;
}

#billing-form .card-status {
	color: #000000;
	padding-top: 5px;
	padding-bottom: 10px;
}

#billing-section #flash-error ul {
	margin: 0;
}

.plan-type-selection {
    margin: 20px auto 0;
    padding: 0;
}

.plan-type-selection .options {
    width: 260px; margin: 0 auto;
}

.plan-type-submit {
    width: 260px;
}

.plan-type-company {
    width: 260px !important;
}

.plan-type-note {
	width: 260px;
	color: #3a3a3a;
	font-family: "MuseoSans-300", Arial, Helvetica, sans-serif;
	line-height: 1.438em;
	margin: 35px auto 40px auto;
}

.plan-type-selection .options ul{
    margin:0 auto; padding:0; list-style:none;
}
.plan-type-selection .options li{
    background:#fafafa;
    padding:20px 0 0 0; width:130px; height:104px;
    font-size:16px; color:#999; font-weight:600;
    text-decoration:none; text-transform:uppercase;
    text-align:center; cursor:pointer; margin: 0 auto;
    display: table-cell;
}

.plan-type-selection .options li.selected,
.plan-type-selection .options li.selected:hover{
    background:#6ab3e0; color:#fff;
}
.plan-type-selection .options li:hover{
    background:#ddd; color:#333;
}

.plan-type-selection .options li > div {
	padding-top: 10px;
	font-size: 18px;
}

/*** New Equipment form ***/
.new-cafe-location .form-equipment .rows-inline label.equipment-type {
	width: 215px;
}

.new-cafe-location .form-equipment .rows-inline .quantity {
	width: 84px;
}

.new-cafe-location .form-equipment .rows-inline .equipment-price {
    line-height: 30px;
}

.new-cafe-location .form-equipment .rows-inline .ico-info {
	height: 33px;
	margin-bottom: 10px;
	background-position: 0 -787px;
}

.new-cafe-location .form-equipment .equipment-list,
.new-cafe-location .form-equipment .for-btn {
	padding-top: 10px;
}

.new-cafe-location .form-equipment .total {
    border-top: 1px solid #ccc;
    clear: both;
    height: 40px;
    padding: 30px 0 50px;
    margin-top: 20px;
}

.new-cafe-location .form-equipment .total label {
    color: #999;
    float: left;
    font-size: 20px;
}

.new-cafe-location .form-equipment .total .price-due {
    color: #69b3e0;
    float: right;
    font-size: 42px;
    font-weight: bold;
}

.new-cafe-location .form-equipment .total > ul {
    clear: both;
    color: #999;
    float: right;
    font-size: 14px;
    list-style: outside none none;
    padding: 8px 0 0;
}

.new-cafe-location .form-equipment .total li {
    line-height: 16px;
}

/*** Login Verification form ***/
#login-verification-form .for-btn {
	margin-top: 20px;
}

#login-verification h3 {
	margin-bottom: 10px;
}

#resend-code-notification {
	display: none;
}

/*** cafe installation dates ***/
.install-date .caption {
	color: black;
}

.kcform .install-date .field.left {
	width: 65%;
}

.kcform .install-date .ico-info {
	width: 29px;
	height: 29px;
	background-position: -3px -788px;
	float: right;
}

.kcform .install-date .with-icon input[type=text]  {
	width: 85%;
}

.kcform .install-date .with-icon .calendar {
	float: left;
	margin-right: 5px;
}

.kcform .install-date .field.right {
	width: 28%;
}

@media only screen and (max-width: 380px) {
	.kcform .install-date .with-icon input[type=text] {
		width: 80%;
	}
	.kcform .install-date .field.right {
		width: 23%;
	}
}

@media only screen and (max-width: 285px) {
	.kcform .install-date .with-icon input[type=text] {
		width: 70%;
	}
}

@media only screen and (max-width: 480px) {
	.kcform .install-date .field.left {
		width: 63%;
	}
}

@media only screen and (min-width: 768px) and (max-width: 1000px) {
	.kcform .install-date .field.left {
		width: 63%;
	}
}

/*** Billing - Plan Selection ***/
.plan-selection{
margin:20px auto 0; padding:0;
}
	.plan-selection .plan-msg.notice{
	background:#f9f9f9; border:1px solid #dbdbdb;
	padding:8px 10px; font-size: 12px; color:#333;
	}

	.plan-selection .options{
	width:260px; float:left;
	}
    .plan-selection .options.enterprise{
    clear: both;
    }
		.plan-selection .options ul{ 
		margin:0; padding:0; list-style:none; text-align: center; font-size: 0;
		}
		.plan-selection .options li{
		background:#fafafa; margin: 0 auto; display:inline-block;
		padding:20px 0 0 0; width:130px; height:104px;
		font-size:14px; color:#999; font-weight:600;
		text-decoration:none; text-transform:uppercase;		
		text-align:center; cursor:pointer;
		}
			.plan-selection .options li >span{ 
			padding:20px 0 0 0; 
			display:block; clear:both;
			font-size:32px; 
			}
		.plan-selection .options li.selected,
		.plan-selection .options li.selected:hover{
		background:#6ab3e0; color:#fff;
		}
		.plan-selection .options li:hover{
		background:#ddd; color:#333;
		}
					
	.plan-selection .subtitle{ 
	width:100%; height:60px; display:block; clear:both;
	text-align:center; color:#999; line-height:50px; 
	}
	
	.plan-selection .key-count{
	margin:32px 0 0 0; text-align:center; 
	width:185px; float:right;
	}
		.plan-selection .key-count > b,
		.plan-selection .key-count .quantity{
		width:90px; height:90px; line-height:90px;
		}
		.plan-selection .key-count > b{
		display:block; float:left; 
		font-size:30px; color:#999;	font-weight:300;
		}
		.plan-selection .key-count .quantity{
		background:#fff; float:right; border:1px solid #6ab3e0; 
		color:#666; font-size:32px; font-weight:600; 
		text-align:center;
		}

.plan-selection .key-count .subtitle {
	text-align: center;
	float: right;
	width: 90px;
}

.plan-selection .key-count.key-count-enterprise .subtitle {
	right: 10px;
}
		
	.plan-selection .total{	
	padding:0 0 60px;
	clear:both; height:40px;  
	}
		.plan-selection .total label{
		float:left;
		font-size:20px; color:#999;
		}
		.plan-selection .total > b{
		float:right;
		font-size:42px; color:#69b3e0;
		}
		.plan-selection .total > ul{
		padding:8px 0 0 0;
		float:right; clear:both; list-style:none;
		font-size:14px; color:#999;		
		}
			.plan-selection .total li{
			line-height:16px;
			}

    .plan-selection .key-counts{ float: none; width:260px; }
    .plan-selection .key-counts.enterprise{ width: 100%; clear:both;}
        .plan-selection .key-counts .plus {float: left; text-align: center; width: 10%; margin-top: 30px; font-size: 32px; }
        .plan-selection .key-counts .key-count {margin:0 0 20px; padding:0; width: 45%; float: left; text-align: center}
        .plan-selection .key-counts.enterprise .key-count {width: 90px;}
        .plan-selection .key-counts.enterprise .plus {width: 87px;}
        .plan-selection .key-counts .key-count .quantity {display: inline-block; float: none}
        .plan-selection .key-counts .key-count .subtitle {text-align: center; position: inherit; line-height: 25px; font-size: 14px;}
        .plan-selection .key-counts .key-count .subtitle p {margin-top: 0; margin-bottom: 0;}


.plan-selection ~ .for-hibernate{
font-size:11px; color:#747474;
text-transform:uppercase; 
cursor:pointer;
}
	.plan-selection ~ .for-hibernate .remove span{
	background: #747474;
	text-transform: lowercase;
	margin-left: 10px;
	color: #fff;
	border: 1px solid #fff;
	width: 15px;
	height: 15px;
	font-size: 11px;
	line-height: 13px;
	display: inline-block;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
	}

.plan-selection + .plan-submit{ 
margin:0; padding:0; 
position:relative;
}
	.plan-selection + .plan-submit .ctrl{ 
	background:none; padding:0;
	border:0; outline:0; cursor:pointer;
	font-size:14px; color:#999;	line-height:30px;
	}
	.plan-selection + .plan-submit .ctrl:hover{ 
	color:#6ab3e0;
	}  
	.plan-selection + .plan-submit .for-btn{
	-moz-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	transition: all 0.5s ease;
	}  
	.plan-selection + .plan-submit .moved{ 
	position:absolute; top:120px; right:0; 
	}
	.plan-selection ~ .plan-hibernate { display:none;  }
	.plan-selection ~ .plan-hibernate.shown { padding-bottom:40px;  }
	.plan-selection ~ .plan-hibernate .note{
	margin:0; padding:10px 0;
	font-size:14px; color:#999;	line-height:normal;
	}

/* Account settings page */
.settings-table {
	width: 100%;
}

.settings-table .checkboxes input[type=checkbox] + label span {
    width: 30px;
}

.settings-table th {
	white-space: nowrap;	
}

.settings-table td {
    width: 52px;
}

.settings-table td:first-child {
    width: auto;
}

#plan-form-section .hibernate-fields .for-btn,
#cancel-acc-form .for-btn {
	margin-top: 10px;

}

#webhook-settings-form {
	margin-top: 20px;
}

#webhook-settings-form .btn {
	border: none;	
}

#webhook-progress {
	visibility: hidden;
}

/* Support Action Forms */

#support-actions > a {
	padding-left: 10px;
	padding-right: 10px;
}

#status-update textarea,
#visibility-update textarea,
#comment-create textarea {
	height: 75px;
}

#status-update .with-icon input[type='text'] {
	width: 92%;
}

/**
 * Mobile styles
 * -----------------------------------------------------------------------------
 */				
 
 @media only screen and (max-width:400px){
 /*** Billing - Plan Selection ***/
.plan-selection .options,
.plan-selection .key-count{ margin:0 auto; float:none; }
.plan-selection .options li{ width:50%; }
.plan-selection + .plan-submit .moved { top: 160px; }
.plan-selection .total{ padding:40px 50px; }
.plan-selection .key-counts.enterprise .key-count {width: 45%;}
.plan-selection .key-counts.enterprise .plus {width: 10%;}
}/* end 400 */ 

 @media only screen and (max-width:360px){
 /*** Billing - Plan Selection ***/
.plan-selection .options{ width:100%; }
.plan-selection .key-count{ float:right; }
.plan-hibernate .dropdown .trigger{ font-size:14px !important; }
.plan-hibernate .dropdown .options{ font-size:14px; }
.plan-selection .total{ padding:40px 0; }
}/* end 360 */
 
@media only screen and (max-width:875px){
/* form inside secure form: +Access */
.switch-options .field.show-oncheck{ width:40%;}
.switch-options .field.show-oncheck.more-info-details{ width:100%; }
}/* end 875px */				


@media only screen and (max-width:800px){
/*** Layouts *----------------------- */	
.kcform .field.half .qtr{ margin-bottom:10px; width:100%; }
/* half of the quarter width */
.kcform .is-xs{ width:23.6111%; margin:0  0.9259%; }  
.kcform .is-xs:first-child{ width:23.6111%; }  
.kcform .is-xs:last-child{ width:23.6111%; }   

/*** Inputs: with icon *----------------------- */
.kcform .with-icon.qtr input[type=text]{
width:  87.27273%; /* 240 / 275 */
float:left; 
}

/*** Inputs: with icon inside input *----------------------- */
.kcform .with-icon.inner input[type=text]{
width:100%;  
}	

/** * Inputs: with group of icons *----------------------- */		
.kcform .with-icon.grp .cc-card{
width:74.66667%; /* 560 / 750 */
}

/* specific: inside a .grid-2.col2 */
.has-form.grid-2.col-2 .kcform .with-icon.grp .cc-card{
width:62.66666666666667%; /* 235 / 375 */
}	
.has-form.grid-2.col-2 .kcform .with-icon .icon-grp {	
width:34.66666666666667%; /* 130 / 375 */
}	

}/* end 800px */

@media only screen and (min-width: 500px) {
	.plan-selection .key-counts.enterprise .plus.first-plus {
		display: none;
	}
}

@media only screen and (max-width: 400px)  {
	.plan-selection .key-counts .key-count .quantity {
		float: left;
		display: block;
		clear: left;
		margin-left: 12%;
	}

	.plan-selection .key-counts .key-count .subtitle {
		margin-left: 25% !important;
	}
}

@media only screen and (max-width: 500px) {
	.plan-selection .key-count > b, .plan-selection .key-count .quantity  {
		float: left;
		margin-left: 35%;

	}

	#plan-form-BASIC_PLAN_TYPE .plan-selection .key-count .subtitle {
		float: left;
		margin-left: 35%;
	}

	.plan-selection .key-counts .key-count .subtitle p {
		padding-left: 10px;
	}

	.plan-selection .key-counts .key-count .quantity {
		margin-left: 0px;
	}

	.plan-selection .key-count.key-count-enterprise .subtitle {
		float: left;
		margin-left: 35%;
	}

	.plan-selection .key-counts .key-count .subtitle {
		height: 60px;
	}

	.plan-selection .key-count .quantity {
		clear: left;
	}
	#plan-section-wrap-col {
		width: auto;
	}

	.plan-selection .options, .plan-selection .key-count {
		margin: 0 auto;
		float: none;
	}

	.plan-selection .key-count {
		margin-bottom: 30px;
	}

	.plan-selection .key-counts.enterprise {
		margin: 0 auto;
		width: 185px;
	}

	.plan-selection .key-counts.enterprise .key-count, .plan-selection .key-counts.enterprise .plus {
		float: left;
		margin-left: 35%;
		clear: left;
		margin-bottom: 0px;
	}

	.plan-selection .key-counts.enterprise .plus {
		margin-top: 0;
		margin-bottom: 10px;
		width: 90px;
	}
}

#plan-section-wrap-col {
	width: auto;
}

@media only screen and (max-width:768px){	
/*** Layout *----------------------- */
/* grids */
.has-form, .grid-1.has-form.login{
margin-top: 50px;
width: 300px; float: none;
}
.has-form.grid-2.col-2{ 
margin-top:40px;
max-width:445px; float:none; 
}

/*** Input: phone number, mobile number *----------------------- */
.kcform .tel{ margin-left:0; text-align: left; }
.kcform .tel .error,
.kcform .tel .note,
.kcform .tel .msg{ padding-left:10px; } 

/* specific: inside a .grid-2.col2 */
.has-form.grid-2.col-2 .kcform .with-icon.grp .cc-card{
width:67.41573033707865%; /* 300 / 445 */
}	
.has-form.grid-2.col-2 .kcform .with-icon .icon-grp {	
width:29.213483146067415%; /* 130 / 445 */
}	

/* form: +Access */
.switch-options .field.date .date-wrapper .hasDatepicker{
width:78.31325%; /* 130 / 166 */
}
}/* end 768px */
 
 
@media only screen and (max-width:640px){
/*** Input: phone number, mobile number *----------------------- */
.kcform .tel .phone{ width:72.60274%; /* 212 / 292 */}

/*** Inputs: with group of icons *----------------------- */
.kcform .with-icon.grp .cc-card{
width: 74.59016%; /* 455 / 610 */
}
}/* end 640px */
 
 
@media only screen and (max-width:604px){
/*** Buttons: Layout *----------------------- */
.kcform .field.for-btn{
margin-bottom:20px;
}
	.kcform .field > .for-btn{
	margin:20px auto;
	}
	/* buttons side by side */
	.kcform .field > .for-btn.inline a,
	.kcform .field > .for-btn.inline input[type=submit],
	.kcform .field > .for-btn.inline input[type=reset],
	.kcform .field > .for-btn.inline button{
	margin-bottom:5px;
	}
	
/*** Specific Contents *----------------------- */
.kcform .retire{ line-height: 30px; }


/*** Form inputs: text, email, password; Form textarea *----------------------- */
/*** full field has inline elements only*----------------------- */
.kcform .field.has-inline .field{ margin:0 0 5px; padding:0; }
.kcform .field.has-inline input[type="text"],
.kcform .field.has-inline label,
.kcform .field.has-inline .half,
.kcform .field.has-inline .qtr{ display:block; width:100%; }

.kcform .field.has-inline label{ text-align:left !important; }  
.kcform .field.has-inline .for-btn{ margin:20px auto; }


/*** Inputs: with icon *----------------------- */
.kcform .with-icon input[type=text]{
width:93.8596%; /* 535 / 570 */ 
}
	.kcform .with-icon.half input[type=text],
	.kcform .with-icon.qtr input[type=text]{
	width:87.5912%; /* 240 / 274 */
	}

/*** Inputs: with icon inside input *----------------------- */
.kcform .with-icon.inner input[type=text]{
width:100%;  
}	
	
/*** Input: phone number, mobile number *----------------------- */
.kcform .tel .phone{ width:71.168%; /* 195 / 274 */ } 

/*** Radio *----------------------- */
.kcform .radio .radio-item{ display:block; }

/* form inside secure form: +Access */
.switch-options .field.has-show-oncheck{ 
width: 62.02899%; /* 214 / 345 */ 
}
.switch-options .field.show-oncheck{ 
width:45%;
}

}/* end 604px */
 
 
@media only screen and (max-width:540px){
/*** Inputs: with group of icons *----------------------- */
.kcform .with-icon.grp .cc-card{
width: 71.56863%; /* 365 / 510 */
}	
.kcform .with-icon.grp .icon-grp{
width:25.4902%; /* 130 / 510 */
}

/*** Input: phone number, mobile number *----------------------- */
.kcform .tel .phone{ width: 70.58824%; /* 360 / 510 */ } 

/* form inside secure form: +Access */
.switch-options .field.show-oncheck{ 
width:35%;
}
.switch-options .field.date .date-wrapper .hasDatepicker{
width:80%;
}
}/* end 540px */


@media only screen and (max-width:480px){
/*** Layout *----------------------- */
/* grids */
.has-form, .grid-1.has-form.login{
width:100%;
}
.kcform .row{ margin: 0px auto; }
.kcform .field{ margin: 0px auto 10px !important; }
.kcform .half, 
.kcform .qtr { width: 100%; }
	/* half of the quarter width */
	.kcform .is-xs,
	.kcform .is-xs:first-child,
	.kcform .is-xs:last-child{ 	
	margin:0 auto 10px; 
	width:100%; float:left;
	}  
	.kcform .is-xs.has-label label{ text-align:left; }  
	 
	 
/*** Specific Contents *----------------------- */
.kcform .error{ padding-top:5px; }

/*** Buttons: Width or area *----------------------- */
.kcform .btn{ 
height:40px; line-height:40px;  
}	
/*** Buttons: Sizes *----------------------- */
.kcform .btn.tiny{
height:35px; line-height:35px;
}

/*** Form inputs: text, email, password; Form textarea *----------------------- */
.kcform input[type="text"],
.kcform input[type="email"],
.kcform input[type="password"],
.kcform input[type="tel"]{
padding:10px; line-height:20px; vertical-align:middle;
}
.kcform textarea{ padding:10px; }

/*** full field has inline elements only *----------------------- */
.kcform .field.has-inline .field{ 
margin:0 auto 10px;  
}
.kcform .field.has-inline .field.for-btn{ 
margin:20px auto;  
}

/*** set or rows of fields has inline elements *----------------------- */
.kcform .rows-inline .field.half{ width:35%; }
.kcform .rows-inline label{ width:35px; }
.kcform .rows-inline label.to { width:25px !important; padding-left:10px; }

/*** Input has labels *----------------------- */
.kcform .has-label{ margin:0; }

/* any text as label */
.kcform .as-label{ height:30px; }

/*** Inputs: with icon *----------------------- */
.kcform .with-icon input[type=text],
.kcform .with-icon.half input[type=text],
.kcform .with-icon.qtr input[type=text]{
width:92.22%; /* 415 / 450 */
}
	
.kcform .with-icon.half.inner input[type="text"], 
.kcform .with-icon.qtr.inner input[type="text"] { width:100%; }	

/*** Inputs: with group of icons *----------------------- */
.kcform .with-icon.grp .cc-card{
margin:0 auto 10px; 
width:100%;
}
.kcform .with-icon.grp.half .cc-card {
width:100%;
}
.kcform .with-icon.grp .icon-grp{
margin:0 auto 5px; 
width:100%;
}
.kcform .with-icon.grp .icon-grp{ padding:0; }

/*** Inputs: icons used *----------------------- */
.kcform .with-icon .calendar{	
margin-top:5px;
}
.kcform .with-icon .globe,
.kcform .with-icon .search{ height: 40px; }
.kcform .with-icon .pickup,
.kcform .with-icon .dropoff{
width:40px;
}


/*** Input: phone number, mobile number *----------------------- */
.kcform .tel{ margin:0 auto 10px; } 
	.kcform .tel .plus{ line-height:40px; } 
	.kcform .tel .phone{ width: 71.11%; /* 320 / 450 */ } 
.kcform .tel.half { width:100%; }

 /*** Input: type file (upload) *----------------------- */
.kcform input[type=file],
.kcform .custom-file-input {
padding:10px 0 0;
width:100%; line-height:30px;
}

/*** Read-only form inputs *----------------------- */
.kcform .readonly{ margin:0; }
.kcform .readonly .field{ margin-bottom:5px; }

/*** Dropdown: <ul> styled as dropdown *----------------------- */
.kcform .dropdown{ margin:0 auto; height:40px; }
.kcform .dropdown .trigger{ line-height:30px; max-height: 30px; }
.kcform .dropdown .trigger:after { top:30px; }
.kcform .dropdown .options li,
.kcform .dropdown .options li:hover { line-height:24px; }

/* form inside secure form: +Access */
.switch-options .field.has-show-oncheck{ height:28px; }
.switch-options .field.has-show-oncheck,
.switch-options .field.show-oncheck { width:100%; }
.switch-options .field.date .date-wrapper .hasDatepicker{
width:88%;
}

/* Account Settings > Notification */
.kcform .checkboxes.notif {
margin-left:40px;
float:left !important;
}
.kcform .checkboxes.notif p{ text-align:left; }

/* specific: inside a .grid-2.col2 */
.has-form.grid-2.col-2 .kcform .with-icon .icon-grp {
margin:8px 0 0 0 !important;
}

.new-cafe-location .form-equipment .rows-inline .equipment-price {
line-height: 40px; margin-left: 5px;
}

} /* end 480px */
 
 
@media only screen and (max-width:400px){
.kcform .field.half .qtr.left + .qtr.right{ margin:0 auto !important; }

/*** Input: phone number, mobile number *----------------------- */
.kcform .tel .phone{ width:70.27027%; /* 260 / 370 */ }

/*** Inputs: with group of icons *----------------------- */
.kcform .with-icon.grp input.cc-card[type="text"] {
width:100%;
}
	.kcform .with-icon .icon-grp {	
	margin:5px 0 0 0; float:left;  
	}	
	
/* specific: inside a .grid-2.col2 */
.has-form.grid-2.col-2 .kcform .with-icon.grp .cc-card,	
.has-form.grid-2.col-2 .kcform .with-icon .icon-grp {	
width:100%;  
}	
.has-form.grid-2.col-2 .kcform .with-icon .icon-grp {
margin:0 !important;
}

	.actions .new-access-form .field.date .date-wrapper .hasDatepicker {
		width: 82%;
	}
}
/* end 400px */
 
@media only screen and (max-width:360px){
/*** set or rows of fields has inline elements *----------------------- */
.kcform .rows-inline .field{ margin:0 5px 10px 0; }
.kcform .rows-inline .field.half{ width:35%; }

/*** Inputs: with icon *----------------------- */
.kcform .with-icon input[type=text],
.kcform .with-icon.half input[type=text],
.kcform .with-icon.qtr input[type=text]{
width:89.3939%; /* 295 / 330 */
}

/*** Inputs: with group of icons *----------------------- */
.kcform .with-icon.grp  input[type=text].cc-card{
width:100%;  
}	
	.kcform .with-icon .icon-grp {	
	margin:5px 0 0 0; float:left;  
	}	
	
/*** Input: phone number, mobile number *----------------------- */
.kcform .tel .phone{ width:69.69697%; /* 230 / 330 */ }

}/* end 360px */


@media only screen and (max-width:320px){
/*** Specific Contents *----------------------- */
.kcform .retire{
margin:5px 5px 0; padding-top:5px;
font-size:12px;
}

/*** Form titles - inside .kcform *----------------------- */
.kcform h3,
.kcform .access-title h3{ font-size:20px; }

/*** Input: phone number, mobile number *----------------------- */
.kcform .tel .phone{ width: 67.24138%; /* 195 / 290 */ }

} /* end 320px */

/** Task admin reset buttons **/
.task-reset-buttons-form {
	display: none;
	margin-top: 5px;
}

/*** Account Details Form ***/

#account-details .header {
	margin-top: 15px;
}

.order-now .order-sent {
	margin-top: 100px;
	margin-bottom: 100px;	
}

/*** Purchase Order Form ***/
.kcform .purchase-order-equipment {
    width: 100%;
}

.kcform .equipment-display-name {
    color: black;
}

.kcform .spacer {
    height: 10px;
}

.kcform .purchase-order-field {
    float: right;
}

.kcform .purchase-order-comments {
    resize: none;
}

/*** Field description ***/
.kcform .description {
    padding: 8px 35px 8px 14px;
    margin: 5px 0 10px;
    color: #3a87ad;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    background-color: #d9edf7;
    border: 1px solid #bce8f1;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}