/*------------------------------------*\
    FORM
\*------------------------------------*/

form {
    background-color:#f2f2f2;
    width:480px;
    height:270px;
    padding:110px 20px 0 20px;
    box-shadow:0 0 30px 0 rgba(0,0,0,.5);
    border-radius:6px;
}

/*------------------------------------*\
    FONT
\*------------------------------------*/
.label label,
.field .block,
.field .list,
.choose .list,
.button span,
.info p { 
    font-family:Helvetica, 'Helvetica Neue', Arial, sans-serif; 
}

/*------------------------------------*\
    CONTAINER OFFSET
\*------------------------------------*/

/* [ label|input group offset ] */
[data-editable="custom"] {
    padding:7px 5px;
}

/*------------------------------------*\
    LABEL
\*------------------------------------*/

.label label { 
    font-size:12px;
    font-weight:bold;
    color:#373737;
    line-height:2;
}

/*------------------------------------*\
    BORDER - input, select list, select placeholder
\*------------------------------------*/

/* Only border|border-radius */ 
.field .border {
    border:1px solid #c2c2c2;
    border-radius:4px;
}

/*------------------------------------*\
    INPUT/PLACEHOLDER
\*------------------------------------*/

/* [ Input|select placeholder ] */
.field .block {
    font-size:16px;
    font-weight:normal;
    font-style:italic;
    color:#373737;
    background-color:#fff;
}

/* [ Input|select|textarea padding ] */
.field .padding {
    padding-left:12px;
    padding-right:12px;
    padding-top:10px;
    padding-bottom:10px;
}

.label-position-left .label,
.label-position-right .label {
    padding-top: 10px; /* Only padding-top */
}

/* [ Nativ placeholder ] */
.field .placeholder.like-placeholder {
    font-family:inherit;
    font-size:inherit;
    font-weight:inherit;
    font-style:inherit;
    color:inherit;
    text-align:inherit;
}

input::-webkit-input-placeholder, 
textarea::-webkit-input-placeholder { 
    font-family:inherit;
    font-size:inherit;
    font-weight:inherit;
    font-style:inherit;
    color:inherit;
    text-align:inherit;
}

input:-moz-placeholder, 
textarea:-moz-placeholder { 
    font-family:inherit;
    font-size:inherit;
    font-weight:inherit;
    font-style:inherit;
    color:inherit;
    text-align:inherit;
}

input::-moz-placeholder, 
textarea::-moz-placeholder { 
    font-family:inherit;
    font-size:inherit;
    font-weight:inherit;
    font-style:inherit;
    color:inherit;
    text-align:inherit;
}

input:-ms-input-placeholder, 
textarea:-ms-input-placeholder { 
    font-family:inherit;
    font-size:inherit;
    font-weight:inherit;
    font-style:inherit;
    color:inherit;
    text-align:inherit;
}

/*------------------------------------*\
    DROPDOWN SELECT LIST
\*------------------------------------*/

/* [ List block - that same padding like .field .padding ] */
.list-item label {
    padding-left:12px;
    padding-right:12px;
}

/* [ Drop List::select|phone ] */
.field .list {
    font-size:16px;
    font-weight:normal;
    line-height:1.4;
    color:#373737;
    background-color:#fff;
}

/* [ Drop list text background::select|phone ] */
.field .list .list-item .item-label {}

/* [ Hover text background|color - :hover and .hover add two times -> editor required] */
.field .list .list-item:hover .item-label {
    color:#e93f88;
}

.field .list .list-item .item-label.hover {
    color:#e93f88;
}
 
/* [ Selected text background|color ] */
.field .list-item .item-label.selected,
.field .list-item input:checked + .item-label {
    color:#e93f88;
}

/*------------------------------------*\
    RADIO/CHECKBOX
\*------------------------------------*/

/* [ Radio|Checkbox text style ] */
.choose .list {
    font-size:16px;
    font-weight:normal;
    color:#373737;
    line-height:1.4;
}

/* [ Item background - background on text in <li> ] */
.choose .list .list-item .item-label {}

/* :hover and .hover add two times -> editor required */
.choose .list .list-item:hover .item-label {
    opacity: 0.7;
}

.choose .list .list-item .item-label.hover {
    opacity: 0.7;
}

/* [ Selected ] */
.choose .list-item .item-label.selected,
.choose .list-item input:checked + .item-label {
    color:#e93f88;
}

/*------------------------------------*\
    BUTTON
\*------------------------------------*/

.button {    
    height:50px;
    border-radius:4px;
    background-color:#e93f88;
}

.button span {
    font-family:'Sansita One', cursive;
    font-size:20px;
    font-weight:normal;
    color:#ffffff;
}

/* :hover and .hover add two times -> editor required */
.button:hover {
    background-color:#ec5c9a;
}

.button.hover {
    background-color:#ec5c9a;
}

/*------------------------------------*\
    FIELD ICO
\*------------------------------------*/

.field-icon .field-icon-sign::after {
    padding-right:12px; /* that same padding like .field .padding */
}

.field-icon.select.open .field-icon-sign::after {
    padding-left:12px; /* that same padding like .field .padding */
    padding-right:0; /* clear right because transform rotate */
}

/*------------------------------------*\
    INFORMATION TEXT
\*------------------------------------*/
 
.info p {
    font-family:Helvetica, 'Helvetica Neue', Arial, sans-serif;
    font-size:10px;
    font-weight:normal;
    font-style:italic;
    color:#373737;
    line-height:2;
}