/** @file CSS for styling form elements. */

main form { width: 100%; max-width: 680px; margin: 0 auto; }

input { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border-radius: 0; -moz-appearance: none; -webkit-appearance: none; appearance: none; }
input:focus { outline: none; }
input[type=date], input[type=datetime], input[type=datetime-local], input[type=email], input[type=month], input[type=number], input[type=password], input[type=range], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week] {
    display: block; width: 100%; box-sizing: border-box; border: 1px solid #d5d5d5; font-family: 'SSThin', sans-serif; font-size: 20px; line-height: 31px; letter-spacing: 1px; padding: 12px 20px; margin-bottom: 0; }
input[type=checkbox], input[type=radio] { width: 13px; height: 13px; }
input[type=checkbox] { opacity: 0; }
button, input[type="reset"], input[type="button"], input[type="submit"] { font-family: 'OSBold', sans-serif; text-transform: uppercase; font-size: 11px; padding: 12px 25px; margin: 0; letter-spacing: 2px; color: #ffffff; cursor: pointer;
    -moz-appearance: none; -webkit-appearance: none; appearance: none; }

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }

form .form-item { margin-bottom: 15px; }

.form-item label { display: block; font-family: 'OSBold', sans-serif; letter-spacing: 2px; font-size: 11px; text-transform: uppercase; padding-bottom: 5px; }
.form-item label.form-required::after { content: "*"; color: #d56341; }

form .description { display: inline; font-family: 'elight', serif; font-size: 12px; line-height: 20px; padding: 6px 5px 6px 10px; margin-left: -10px; margin-top: 5px; letter-spacing: 1.6px; text-align: left;
    background-color: rgba(244, 228, 223, 0.4); }

form select { display: block; width: 100%; box-sizing: border-box; border: 1px solid #d5d5d5; border-radius: 0; font-family: 'SSThin', sans-serif; font-size: 20px; letter-spacing: 1px; line-height: 31px; padding: 12px 20px; cursor: pointer;
    -webkit-appearance: none;
    background-color: #ffffff; background-image: url('../../images/downarrow.svg'); background-size: 15px; background-position: right 15px center; background-repeat: no-repeat; }

form textarea { display: block; width: 100%; box-sizing: border-box; border: 1px solid #d5d5d5; font-family: 'SSThin', sans-serif; font-size: 22px; letter-spacing: 1px; padding: 15px; }

form .js-form-type-checkbox label { position: relative; padding: 7px 0 9px 45px; color: #283d38; font-size: 10px; line-height: 16px; }
form .js-form-type-checkbox label::before, .js-form-type-checkbox label::after { display: inline-block; position: absolute; }
form .js-form-type-checkbox label::before { content: ""; height: 28px; width: 28px; border: 1px solid #d9d9d9; background: #ffffff; top: 0; left: 0; }
form .js-form-type-checkbox label::after { content: "";  height: 8px; width: 16px; border-left: 3px solid #52c0a7; border-bottom: 3px solid #52c0a7; transform: rotate(-45deg); top: 8px; left: 6px; }

form .js-form-type-checkbox input[type="checkbox"] + label::after { content: none; }
form .js-form-type-checkbox input[type="checkbox"]:checked + label::after { content: ""; }

/** For individual form requirements **/

fieldset legend { float: left; width: 100%; text-align: center; padding: 5px 15px 25px 15px; font-family: 'SSThin', sans-serif; letter-spacing: 0.05em; font-size: 24px; }
fieldset .fieldset-wrapper { clear: both; }

.commerce-checkout-flow { width: 100%; max-width: 500px; padding: 25px; margin: 0 auto; }

.commerce-checkout-flow fieldset { width: 100%; border: 0; padding: 25px; margin: 0 auto 25px;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;
    background: #ffffff;
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.12),2px 2px 8px 0px rgba(0,0,0,0.4); }

.commerce-checkout-flow fieldset .fieldset-wrapper {  }
.commerce-checkout-flow fieldset .fieldset-wrapper .form-item label { text-align: left; }

.commerce-checkout-flow .form-submit { display: block; margin: 0 auto; }
.commerce-checkout-flow a#edit-login-returning-customer-forgot-password,
.commerce-checkout-flow a#edit-email-registration-login-returning-customer-forgot-password { display: table; margin: 25px auto 0; letter-spacing: 2px; font-family: 'OSBold', sans-serif; text-transform: uppercase; font-size: 10px; color: #52c0a7; }
.commerce-checkout-flow a#edit-login-returning-customer-forgot-password:hover,
.commerce-checkout-flow a#edit-email-registration-login-returning-customer-forgot-password:hover { text-decoration: underline; }

.field--type-image summary { display: block; font-family: 'OSBold', sans-serif; letter-spacing: 2px; font-size: 11px; text-transform: uppercase; padding-bottom: 5px; }
.field--type-image summary::marker { display: none; content: ""; }

.field--type-image .js-form-type-managed-file input { float: left; padding: 245px 15px 15px 15px; text-align: center; margin: 5px 0; width: 100%; margin: 15px 0; border: 1px dashed #d5d5d5;
    font-family: 'elight', serif; font-size: 11px; letter-spacing: 0.1em;
    background-image: url('../../images/polaroid.jpg'); background-size: 210px; background-position: top 20px center; background-repeat: no-repeat; }

.field--type-image .js-form-type-managed-file label { display: none; }
.field--type-image .tabledrag-toggle-weight-wrapper,
.field--type-image table thead,
.field--type-image a.tabledrag-handle { display: none; }

.field--type-image table .image-widget img { width: 70%; height: auto; padding: 25px; }
.field--type-image table .image-widget span { display: inline-block; font-family: 'elight', serif; font-size: 11px; letter-spacing: 0.1em; }
.field--type-image table .image-widget span.file { font-family: 'OSBold', sans-serif; padding-left: 25px; }
.field--type-image table .image-widget span.file a { color: #52c0a7; }
.field--type-image table .image-widget span.file a:hover { text-decoration: underline; }

.field--type-image table .ajax-new-content span.button input { border: none; color: #283d38;
    background-image: url('../../images/cross-dark.png'); background-size: 20px; background-repeat: no-repeat; background-position: left center; padding: 12px 25px 12px 30px; font-size: 10px; }
.field--type-image table .ajax-new-content span.button::after { display: none; content: ""; }

/** Contact Forms Specific **/

#block-inbali-contactformdetails { padding: 15px 15px 20px; }
#block-inbali-contactformdetails .container { width: 100%; max-width: 680px; margin: 50px auto 0; overflow: hidden; }

form.contact-form { padding-bottom: 100px; }

.wsap-btn a { display: block; height: 0; padding-top: 50px; width: 50px; margin: 0 auto 5px; overflow: hidden;
    background-image: url('../../images/wsap.png'); background-repeat: no-repeat; background-position: center; background-size: 40px; }
.mail-icon { display: block; height: 0; padding-top: 50px; width: 50px; margin: 0 auto 5px; overflow: hidden;
    background-image: url('../../images/mail.png'); background-repeat: no-repeat; background-position: center; background-size: 40px; }

form.contact-form .form-actions { text-align: center; }

/** Email Subscription Form **/

#simplenews-subscriptions-block-inbali-news { position: relative; }
#simplenews-subscriptions-block-inbali-news #edit-mail-wrapper input { font-size: 20px; line-height: 28px; }
#simplenews-subscriptions-block-inbali-news #edit-actions { position: absolute; bottom: 0; right: 0; }
#simplenews-subscriptions-block-inbali-news #edit-actions input[type="submit"] { position: absolute; bottom: -3px; right: 1px; margin: 0; height: 0; overflow: hidden; width: 50px; padding: 52px 0 0; border: none;
    background-color: transparent; background-image: url('../../images/news.png'); background-size: 32px; background-position: center; background-repeat: no-repeat; }
#simplenews-subscriptions-block-inbali-news #edit-actions input[type="submit"]:hover { background-color: #efefef; }

#block-inbali-subscribe { padding: 30px 0 0 0; }
#block-inbali-subscribe::before { content: ' '; position: absolute; left: -80px; top: 0; width: 95px; height: 95px;
    background-color: transparent; background-image: url('../../images/beach-frangipani.png'); background-size: 100%; background-position: center; background-repeat: no-repeat; }

#block-inbali-subscribe,
#block-inbali-newslettersmallprint { position: relative; width: 100%; max-width: 460px; margin: 0 auto; }

#block-inbali-newslettersmallprint { padding: 10px 30px 80px 30px; text-align: center; }
#block-inbali-newslettersmallprint a { font-family: 'OSBold', sans-serif; letter-spacing: 0.07em; }
#block-inbali-newslettersmallprint a:hover { border-bottom: 1px dotted #283d38; }
#block-inbali-newslettersmallprint::after { content: ' '; position: absolute; right: -70px; top: 0; width: 90px; height: 90px;
    background-color: transparent; background-image: url('../../images/beach-shell.png'); background-size: 100%; background-position: center; background-repeat: no-repeat; }

#block-inbali-subscribe #edit-subscriptions-wrapper { display: none; }
#block-inbali-subscribe .js-form-type-email .description,
#block-inbali-subscribe .js-form-type-email label { display: none; }

#block-inbali-subscribe .form-item-message { font-size: 17px; line-height: 26px; padding: 0 35px; margin-bottom: 20px; text-align: center; }
#edit-subscriptions--wrapper--description { display: none; }

details#edit-simplenews summary, details#edit-simplenews legend { display: none; }