/**********************
 Form containers rules
***********************/

/*****************************************
 Form validation and error global message
******************************************/

/****************************
 Form inputs and label rules
*****************************/
/* Text inputs */
.input-field {
    position      : relative;
    margin-top    : 1rem;
    margin-bottom : 1rem;
}

.input-field.inline {
    display        : inline-block;
    vertical-align : middle;
    margin-left    : 5px;
}

.input-field.inline input,
.input-field.inline .select-dropdown {
    margin-bottom : 1rem;
}

.input-field.col label {
    left : 0.75rem;
}

.input-field.col .prefix ~ label,
.input-field.col .prefix ~ .validate ~ label {
    width : calc(100% - 3rem - 1.5rem);
}

.input-field > label {
    color                    : #5c068c;
    position                 : absolute;
    left                     : 0;
    cursor                   : text;
    -webkit-transition       : color .2s ease-out, font-size .2s ease-out, -webkit-transform .2s ease-out;
    transition               : color .2s ease-out, font-size .2s ease-out, -webkit-transform .2s ease-out;
    transition               : transform .2s ease-out, color .2s ease-out, font-size .2s ease-out;
    transition               : transform .2s ease-out, color .2s ease-out, font-size .2s ease-out, -webkit-transform .2s ease-out;
    -webkit-transform-origin : 0% 100%;
    transform-origin         : 0% 100%;
    text-align               : initial;
    -webkit-transform        : translateY(12px);
    transform                : translateY(12px);
}

input:not([type]),
input[type=text]:not(.browser-default),
input[type=password]:not(.browser-default),
input[type=email]:not(.browser-default),
input[type=url]:not(.browser-default),
input[type=time]:not(.browser-default),
input[type=date]:not(.browser-default),
input[type=datetime]:not(.browser-default),
input[type=datetime-local]:not(.browser-default),
input[type=tel]:not(.browser-default),
input[type=number]:not(.browser-default),
input[type=search]:not(.browser-default),
textarea.materialize-textarea:not(.browser-default) {
    background-color : transparent;
    border           : none;
    border-bottom    : 2px solid #5c068c;
    color            : #040000;
    border-radius    : 0;
    outline          : none;
    height           : 3rem;
    width            : 100%;
    font-size        : 16px;
    margin           : 0;
    box-shadow       : none;
    box-sizing       : content-box;
    transition       : height 0.3s, box-shadow .3s, border .3s, -webkit-box-shadow .3s;
}

input:not([type]):disabled + label,
input:not([type])[readonly="readonly"] + label,
input[type=text]:not(.browser-default):disabled + label,
input[type=text]:not(.browser-default)[readonly="readonly"] + label,
input[type=password]:not(.browser-default):disabled + label,
input[type=password]:not(.browser-default)[readonly="readonly"] + label,
input[type=email]:not(.browser-default):disabled + label,
input[type=email]:not(.browser-default)[readonly="readonly"] + label,
input[type=url]:not(.browser-default):disabled + label,
input[type=url]:not(.browser-default)[readonly="readonly"] + label,
input[type=time]:not(.browser-default):disabled + label,
input[type=time]:not(.browser-default)[readonly="readonly"] + label,
input[type=date]:not(.browser-default):disabled + label,
input[type=date]:not(.browser-default)[readonly="readonly"] + label,
input[type=datetime]:not(.browser-default):disabled + label,
input[type=datetime]:not(.browser-default)[readonly="readonly"] + label,
input[type=datetime-local]:not(.browser-default):disabled + label,
input[type=datetime-local]:not(.browser-default)[readonly="readonly"] + label,
input[type=tel]:not(.browser-default):disabled + label,
input[type=tel]:not(.browser-default)[readonly="readonly"] + label,
input[type=number]:not(.browser-default):disabled + label,
input[type=number]:not(.browser-default)[readonly="readonly"] + label,
input[type=search]:not(.browser-default):disabled + label,
input[type=search]:not(.browser-default)[readonly="readonly"] + label,
textarea.materialize-textarea:disabled + label,
textarea.materialize-textarea[readonly="readonly"] + label {
    color : rgba(0, 0, 0, 0.42);
}

input:not([type]):focus:not([readonly]),
input[type=text]:not(.browser-default):focus:not([readonly]),
input[type=password]:not(.browser-default):focus:not([readonly]),
input[type=email]:not(.browser-default):focus:not([readonly]),
input[type=url]:not(.browser-default):focus:not([readonly]),
input[type=time]:not(.browser-default):focus:not([readonly]),
input[type=datetime]:not(.browser-default):focus:not([readonly]),
input[type=datetime-local]:not(.browser-default):focus:not([readonly]),
input[type=tel]:not(.browser-default):focus:not([readonly]),
input[type=number]:not(.browser-default):focus:not([readonly]),
input[type=search]:not(.browser-default):focus:not([readonly]),
textarea.materialize-textarea:focus:not([readonly]) {
    border-bottom : 2px solid #3e7ac1;
}

input:not([type]):focus:not([readonly]) + label,
input[type=text]:not(.browser-default):focus:not([readonly]) + label,
input[type=password]:not(.browser-default):focus:not([readonly]) + label,
input[type=email]:not(.browser-default):focus:not([readonly]) + label,
input[type=url]:not(.browser-default):focus:not([readonly]) + label,
input[type=time]:not(.browser-default):focus:not([readonly]) + label,
input[type=date]:not(.browser-default):focus:not([readonly]) + label,
input[type=datetime]:not(.browser-default):focus:not([readonly]) + label,
input[type=datetime-local]:not(.browser-default):focus:not([readonly]) + label,
input[type=tel]:not(.browser-default):focus:not([readonly]) + label,
input[type=number]:not(.browser-default):focus:not([readonly]) + label,
input[type=search]:not(.browser-default):focus:not([readonly]) + label,
textarea.materialize-textarea:focus:not([readonly]) + label {
    color : #3e7ac1;
}

input:not([type]):focus.valid ~ label,
input[type=text]:not(.browser-default):focus.valid ~ label,
input[type=password]:not(.browser-default):focus.valid ~ label,
input[type=email]:not(.browser-default):focus.valid ~ label,
input[type=url]:not(.browser-default):focus.valid ~ label,
input[type=time]:not(.browser-default):focus.valid ~ label,
input[type=date]:not(.browser-default):focus.valid ~ label,
input[type=datetime]:not(.browser-default):focus.valid ~ label,
input[type=datetime-local]:not(.browser-default):focus.valid ~ label,
input[type=tel]:not(.browser-default):focus.valid ~ label,
input[type=number]:not(.browser-default):focus.valid ~ label,
input[type=search]:not(.browser-default):focus.valid ~ label,
textarea.materialize-textarea:focus.valid ~ label {
    color : #4caf50;
}

input:not([type]):focus.invalid ~ label,
input[type=text]:not(.browser-default):focus.invalid ~ label,
input[type=password]:not(.browser-default):focus.invalid ~ label,
input[type=email]:not(.browser-default):focus.invalid ~ label,
input[type=url]:not(.browser-default):focus.invalid ~ label,
input[type=time]:not(.browser-default):focus.invalid ~ label,
input[type=date]:not(.browser-default):focus.invalid ~ label,
input[type=datetime]:not(.browser-default):focus.invalid ~ label,
input[type=datetime-local]:not(.browser-default):focus.invalid ~ label,
input[type=tel]:not(.browser-default):focus.invalid ~ label,
input[type=number]:not(.browser-default):focus.invalid ~ label,
input[type=search]:not(.browser-default):focus.invalid ~ label,
textarea.materialize-textarea:focus.invalid ~ label {
    color : #f44336;
}

input:not([type]).validate + label,
input[type=text]:not(.browser-default).validate + label,
input[type=password]:not(.browser-default).validate + label,
input[type=email]:not(.browser-default).validate + label,
input[type=url]:not(.browser-default).validate + label,
input[type=time]:not(.browser-default).validate + label,
input[type=date]:not(.browser-default).validate + label,
input[type=datetime]:not(.browser-default).validate + label,
input[type=datetime-local]:not(.browser-default).validate + label,
input[type=tel]:not(.browser-default).validate + label,
input[type=number]:not(.browser-default).validate + label,
input[type=search]:not(.browser-default).validate + label,
textarea.materialize-textarea.validate + label {
    width : 100%;
}

/* Validation Sass Placeholders */
input.valid:not([type]), input.valid:not([type]):focus,
input[type=text].valid:not(.browser-default),
input[type=text].valid:not(.browser-default):focus,
input[type=password].valid:not(.browser-default),
input[type=password].valid:not(.browser-default):focus,
input[type=email].valid:not(.browser-default),
input[type=email].valid:not(.browser-default):focus,
input[type=url].valid:not(.browser-default),
input[type=url].valid:not(.browser-default):focus,
input[type=time].valid:not(.browser-default),
input[type=time].valid:not(.browser-default):focus,
input[type=date].valid:not(.browser-default),
input[type=date].valid:not(.browser-default):focus,
input[type=datetime].valid:not(.browser-default),
input[type=datetime].valid:not(.browser-default):focus,
input[type=datetime-local].valid:not(.browser-default),
input[type=datetime-local].valid:not(.browser-default):focus,
input[type=tel].valid:not(.browser-default),
input[type=tel].valid:not(.browser-default):focus,
input[type=number].valid:not(.browser-default),
input[type=number].valid:not(.browser-default):focus,
input[type=search].valid:not(.browser-default),
input[type=search].valid:not(.browser-default):focus,
textarea.materialize-textarea.valid,
textarea.materialize-textarea.valid:focus, .select-wrapper.valid > input.select-dropdown {
    border-bottom      : 1px solid #4caf50;
    -webkit-box-shadow : 0 1px 0 0 #4caf50;
    box-shadow         : 0 1px 0 0 #4caf50;
}

input.invalid:not([type]), input.invalid:not([type]):focus,
input[type=text].invalid:not(.browser-default),
input[type=text].invalid:not(.browser-default):focus,
input[type=password].invalid:not(.browser-default),
input[type=password].invalid:not(.browser-default):focus,
input[type=email].invalid:not(.browser-default),
input[type=email].invalid:not(.browser-default):focus,
input[type=url].invalid:not(.browser-default),
input[type=url].invalid:not(.browser-default):focus,
input[type=time].invalid:not(.browser-default),
input[type=time].invalid:not(.browser-default):focus,
input[type=date].invalid:not(.browser-default),
input[type=date].invalid:not(.browser-default):focus,
input[type=datetime].invalid:not(.browser-default),
input[type=datetime].invalid:not(.browser-default):focus,
input[type=datetime-local].invalid:not(.browser-default),
input[type=datetime-local].invalid:not(.browser-default):focus,
input[type=tel].invalid:not(.browser-default),
input[type=tel].invalid:not(.browser-default):focus,
input[type=number].invalid:not(.browser-default),
input[type=number].invalid:not(.browser-default):focus,
input[type=search].invalid:not(.browser-default),
input[type=search].invalid:not(.browser-default):focus,
textarea.materialize-textarea.invalid,
textarea.materialize-textarea.invalid:focus, .select-wrapper.invalid > input.select-dropdown,
.select-wrapper.invalid > input.select-dropdown:focus {
    border-bottom      : 1px solid #f44336;
    -webkit-box-shadow : 0 1px 0 0 #f44336;
    box-shadow         : 0 1px 0 0 #f44336;
}

input:not([type]).valid ~ .helper-text[data-success],
input:not([type]):focus.valid ~ .helper-text[data-success],
input:not([type]).invalid ~ .helper-text[data-error],
input:not([type]):focus.invalid ~ .helper-text[data-error],
input[type=text]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=text]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=text]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=text]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=password]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=password]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=password]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=password]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=email]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=email]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=email]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=email]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=url]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=url]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=url]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=url]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=time]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=time]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=time]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=time]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=date]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=date]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=date]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=date]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=datetime]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=datetime]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=datetime]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=datetime]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=datetime-local]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=datetime-local]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=datetime-local]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=datetime-local]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=tel]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=tel]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=tel]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=tel]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=number]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=number]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=number]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=number]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
input[type=search]:not(.browser-default).valid ~ .helper-text[data-success],
input[type=search]:not(.browser-default):focus.valid ~ .helper-text[data-success],
input[type=search]:not(.browser-default).invalid ~ .helper-text[data-error],
input[type=search]:not(.browser-default):focus.invalid ~ .helper-text[data-error],
textarea.materialize-textarea.valid ~ .helper-text[data-success],
textarea.materialize-textarea:focus.valid ~ .helper-text[data-success],
textarea.materialize-textarea.invalid ~ .helper-text[data-error],
textarea.materialize-textarea:focus.invalid ~ .helper-text[data-error], .select-wrapper.valid .helper-text[data-success],
.select-wrapper.invalid ~ .helper-text[data-error] {
    color               : transparent;
    -webkit-user-select : none;
    -moz-user-select    : none;
    -ms-user-select     : none;
    user-select         : none;
    pointer-events      : none;
}

input:not([type]).valid ~ .helper-text:after,
input:not([type]):focus.valid ~ .helper-text:after,
input[type=text]:not(.browser-default).valid ~ .helper-text:after,
input[type=text]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=password]:not(.browser-default).valid ~ .helper-text:after,
input[type=password]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=email]:not(.browser-default).valid ~ .helper-text:after,
input[type=email]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=url]:not(.browser-default).valid ~ .helper-text:after,
input[type=url]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=time]:not(.browser-default).valid ~ .helper-text:after,
input[type=time]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=date]:not(.browser-default).valid ~ .helper-text:after,
input[type=date]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=datetime]:not(.browser-default).valid ~ .helper-text:after,
input[type=datetime]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=datetime-local]:not(.browser-default).valid ~ .helper-text:after,
input[type=datetime-local]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=tel]:not(.browser-default).valid ~ .helper-text:after,
input[type=tel]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=number]:not(.browser-default).valid ~ .helper-text:after,
input[type=number]:not(.browser-default):focus.valid ~ .helper-text:after,
input[type=search]:not(.browser-default).valid ~ .helper-text:after,
input[type=search]:not(.browser-default):focus.valid ~ .helper-text:after,
textarea.materialize-textarea.valid ~ .helper-text:after,
textarea.materialize-textarea:focus.valid ~ .helper-text:after, .select-wrapper.valid ~ .helper-text:after {
    content : attr(data-success);
    color   : #4caf50;
}

input:not([type]).invalid ~ .helper-text:after,
input:not([type]):focus.invalid ~ .helper-text:after,
input[type=text]:not(.browser-default).invalid ~ .helper-text:after,
input[type=text]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=password]:not(.browser-default).invalid ~ .helper-text:after,
input[type=password]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=email]:not(.browser-default).invalid ~ .helper-text:after,
input[type=email]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=url]:not(.browser-default).invalid ~ .helper-text:after,
input[type=url]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=time]:not(.browser-default).invalid ~ .helper-text:after,
input[type=time]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=date]:not(.browser-default).invalid ~ .helper-text:after,
input[type=date]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=datetime]:not(.browser-default).invalid ~ .helper-text:after,
input[type=datetime]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=datetime-local]:not(.browser-default).invalid ~ .helper-text:after,
input[type=datetime-local]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=tel]:not(.browser-default).invalid ~ .helper-text:after,
input[type=tel]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=number]:not(.browser-default).invalid ~ .helper-text:after,
input[type=number]:not(.browser-default):focus.invalid ~ .helper-text:after,
input[type=search]:not(.browser-default).invalid ~ .helper-text:after,
input[type=search]:not(.browser-default):focus.invalid ~ .helper-text:after,
textarea.materialize-textarea.invalid ~ .helper-text:after,
textarea.materialize-textarea:focus.invalid ~ .helper-text:after, .select-wrapper.invalid ~ .helper-text:after {
    content : attr(data-error);
    color   : #f44336;
}

input:not([type]) + label:after,
input[type=text]:not(.browser-default) + label:after,
input[type=password]:not(.browser-default) + label:after,
input[type=email]:not(.browser-default) + label:after,
input[type=url]:not(.browser-default) + label:after,
input[type=time]:not(.browser-default) + label:after,
input[type=date]:not(.browser-default) + label:after,
input[type=datetime]:not(.browser-default) + label:after,
input[type=datetime-local]:not(.browser-default) + label:after,
input[type=tel]:not(.browser-default) + label:after,
input[type=number]:not(.browser-default) + label:after,
input[type=search]:not(.browser-default) + label:after,
textarea.materialize-textarea + label:after, .select-wrapper + label:after {
    display            : block;
    content            : "";
    position           : absolute;
    top                : 100%;
    left               : 0;
    opacity            : 0;
    -webkit-transition : .2s opacity ease-out, .2s color ease-out;
    transition         : .2s opacity ease-out, .2s color ease-out;
}

/* Textarea */
textarea {
    width            : 100%;
    height           : 3rem;
    background-color : transparent;
}

/* Checkboxes */
input[type="checkbox"], input[type="radio"] {
    box-sizing  : border-box;
    margin      : 4px 0 0;
    padding     : 0;
    line-height : normal;
}

[type="checkbox"]:not(:checked), [type="checkbox"]:checked {
    position : absolute;
    left     : -9999px;
    opacity  : 0;
}

[type="checkbox"]:not(:checked) + label, [type="checkbox"]:checked + label {
    padding-left : 31px;
    display      : inline-block;
    transform    : translateY(0);
}

[type="checkbox"] + label, [type="radio"] + label {
    cursor : pointer;
}

[type="checkbox"] + label:before, [type="checkbox"]:not(.filled-in) + label:after {
    content       : '';
    position      : absolute;
    top           : 0;
    left          : 0;
    width         : 18px;
    height        : 18px;
    z-index       : 0;
    border        : 2px solid #5a5a5a;
    border-radius : 5px;
    margin-top    : 2px;
    transition    : .2s;
}

[type="checkbox"]:checked + label:before {
    top                         : -4px;
    left                        : -5px;
    width                       : 12px;
    height                      : 22px;
    border-top                  : 2px solid transparent;
    border-left                 : 2px solid transparent;
    border-right                : 2px solid #6c3198;
    border-bottom               : 2px solid #6c3198;
    border-radius               : 1px;
    -webkit-transform           : rotate(40deg);
    transform                   : rotate(40deg);
    -webkit-backface-visibility : hidden;
    backface-visibility         : hidden;
    -webkit-transform-origin    : 100% 100%;
    transform-origin            : 100% 100%;
}

[type="checkbox"]:not(.filled-in) + label:after {
    border            : 0;
    -webkit-transform : scale(0);
    transform         : scale(0);
}

div.input-field.error select,
div.input-field.error input,
div.input-field.error textarea {
    color         : #ff0000;
    border-bottom : 2px solid #ff0000;
}

/* Radio */
input[type="radio"] {
    box-sizing : border-box;
    padding    : 0;
}

[type="radio"]:not(:checked), [type="radio"]:checked {
    position : absolute;
    left     : -9999px;
    opacity  : 0;
}

[type="radio"]:not(:checked) + label, [type="radio"]:checked + label {
    position            : relative;
    padding-left        : 35px;
    cursor              : pointer;
    display             : inline-block;
    height              : 25px;
    line-height         : 25px;
    font-size           : 1rem;
    transition          : .28s ease;
    -webkit-user-select : none;
    -moz-user-select    : none;
    -ms-user-select     : none;
    user-select         : none;
    transform           : translateY(0);
}

[type="radio"] + label:before, [type="radio"] + label:after {
    content    : '';
    position   : absolute;
    left       : 0;
    top        : 0;
    margin     : 4px;
    width      : 16px;
    height     : 16px;
    z-index    : 0;
    transition : .28s ease;
}

[type="radio"]:not(:checked) + label:before, [type="radio"]:not(:checked) + label:after, [type="radio"]:checked + label:before, [type="radio"]:checked + label:after, [type="radio"].with-gap:checked + label:before, [type="radio"].with-gap:checked + label:after {
    border-radius : 50%;
}

[type="radio"]:not(:checked) + label:before, [type="radio"]:not(:checked) + label:after {
    border : 2px solid #5a5a5a;
}

[type="radio"]:not(:checked) + label:after {
    -webkit-transform : scale(0);
    transform         : scale(0);
}

[type="radio"]:checked + label:before {
    border : 2px solid transparent;
}

[type="radio"]:checked + label:after, [type="radio"].with-gap:checked + label:before, [type="radio"].with-gap:checked + label:after {
    border : 2px solid #26a69a;
}

[type="radio"]:checked + label:after, [type="radio"].with-gap:checked + label:after {
    background-color : #26a69a;
}

[type="radio"]:checked + label:after {
    -webkit-transform : scale(1.02);
    transform         : scale(1.02);
}

[type="radio"].with-gap:checked + label:after {
    -webkit-transform : scale(0.5);
    transform         : scale(0.5);
}

[type="radio"].tabbed:focus + label:before {
    box-shadow : 0 0 0 10px rgba(0, 0, 0, 0.1);
}

[type="radio"].with-gap:disabled:checked + label:before {
    border : 2px solid rgba(0, 0, 0, 0.26);
}

[type="radio"].with-gap:disabled:checked + label:after {
    border           : none;
    background-color : rgba(0, 0, 0, 0.26);
}

[type="radio"]:disabled:not(:checked) + label:before, [type="radio"]:disabled:checked + label:before {
    background-color : transparent;
    border-color     : rgba(0, 0, 0, 0.26);
}

[type="radio"]:disabled + label {
    color : rgba(0, 0, 0, 0.26);
}

[type="radio"]:disabled:not(:checked) + label:before {
    border-color : rgba(0, 0, 0, 0.26);
}

[type="radio"]:disabled:checked + label:after {
    background-color : rgba(0, 0, 0, 0.26);
    border-color     : #bdbdbd;
}

/* Select */
select.browser-default {
    display : block;
}

.js select:not(.browser-default) {
    display : none;
}

select {
    background-color : rgba(255, 255, 255, 0.9);
    width            : 100%;
    padding          : 5px;
    border           : 1px solid #f2f2f2;
    border-radius    : 2px;
    height           : 3rem;
}

.input-field > select {
    display  : block;
    position : absolute;
    width    : 0;
    height   : 30px;
    top      : 0;
    left     : 0;
    opacity  : 1;
    z-index  : 10;
}

.select-label {
    position : absolute;
}

.select-wrapper {
    position : relative;
}

.select-wrapper.valid + label,
.select-wrapper.invalid + label {
    width          : 100%;
    pointer-events : none;
}

.select-wrapper input.select-dropdown {
    position            : relative;
    cursor              : pointer;
    background-color    : transparent;
    border              : none;
    border-bottom       : 1px solid #9e9e9e;
    outline             : none;
    height              : 3rem;
    line-height         : 3rem;
    width               : 100%;
    font-size           : 1rem;
    margin              : 0 0 20px 0;
    padding             : 0;
    display             : block;
    -webkit-user-select : none;
    -moz-user-select    : none;
    -ms-user-select     : none;
    user-select         : none;
}

.select-wrapper span.caret {
    color       : initial;
    position    : absolute;
    right       : 0;
    top         : 0;
    bottom      : 0;
    height      : 10px;
    margin      : auto 0;
    font-size   : 10px;
    line-height : 10px;
}

.select-wrapper + label {
    position  : absolute;
    top       : -26px;
    font-size : 0.8rem;
}

select:disabled {
    color : rgba(0, 0, 0, 0.42);
}

.select-wrapper.disabled span.caret,
.select-wrapper.disabled + label {
    color : rgba(0, 0, 0, 0.42);
}

.select-wrapper input.select-dropdown:disabled {
    color               : rgba(0, 0, 0, 0.42);
    cursor              : default;
    -webkit-user-select : none;
    -moz-user-select    : none;
    -ms-user-select     : none;
    user-select         : none;
}

.select-wrapper i {
    color : rgba(0, 0, 0, 0.3);
}

.select-dropdown li.disabled,
.select-dropdown li.disabled > span,
.select-dropdown li.optgroup {
    color            : rgba(0, 0, 0, 0.3);
    background-color : transparent;
}

.select-dropdown.dropdown-content li.active {
    background-color : transparent;
}

.select-dropdown.dropdown-content li:hover {
    background-color : rgba(0, 0, 0, 0.06);
}

.select-dropdown.dropdown-content li.selected {
    background-color : rgba(0, 0, 0, 0.03);
}

.prefix ~ .select-wrapper {
    margin-left : 3rem;
    width       : 92%;
    width       : calc(100% - 3rem);
}

.prefix ~ label {
    margin-left : 3rem;
}

.select-dropdown li img {
    height : 40px;
    width  : 40px;
    margin : 5px 15px;
    float  : right;
}

.select-dropdown li.optgroup {
    border-top : 1px solid #eee;
}

.select-dropdown li.optgroup.selected > span {
    color : rgba(0, 0, 0, 0.7);
}

.select-dropdown li.optgroup > span {
    color : rgba(0, 0, 0, 0.4);
}

.select-dropdown li.optgroup ~ li.optgroup-option {
    padding-left : 1rem;
}

.dropdown-content {
    background-color : #fff;
    margin           : 0;
    padding          : 0;
    display          : none;
    min-width        : 100px;
    max-height       : 650px;
    overflow-y       : auto;
    opacity          : 0;
    position         : absolute;
    z-index          : 999;
    will-change      : width, height;
    list-style       : none;
}

.dropdown-content li {
    clear          : both;
    color          : rgba(0, 0, 0, 0.87);
    cursor         : pointer;
    min-height     : 50px;
    line-height    : 1.5rem;
    width          : 100%;
    text-align     : left;
    text-transform : none;
}

.dropdown-content li:hover,
.dropdown-content li.active,
.dropdown-content li.selected {
    background-color : #eee;
}

.dropdown-content li.active.selected {
    background-color : #e1e1e1;
}

.dropdown-content li.divider {
    min-height : 0;
    height     : 1px;
}

.dropdown-content li > a,
.dropdown-content li > span {
    font-size   : 14px;
    color       : #26a69a;
    display     : block;
    line-height : 22px;
    padding     : 14px 16px;
}

.dropdown-content li > span > label {
    top    : 1px;
    left   : 0;
    height : 18px;
}

.dropdown-content li > a > i {
    height      : inherit;
    line-height : inherit;
    float       : left;
    margin      : 0 24px 0 0;
    width       : 24px;
}

.input-field.col .dropdown-content [type="checkbox"] + label {
    top    : 1px;
    left   : 0;
    height : 18px;
}

/******************
 Form buttons rules
*******************/
.btn.btn-primary {
    filter           : none;
    background-image : none;
    color            : #ffffff;
    text-transform   : uppercase;
    border           : 0;
    border-radius    : 2px;
    height           : 36px;
    line-height      : 36px;
    font-weight      : bold;
    padding          : 0 20px !important;
    outline          : 0;
}

.btn.btn-primary:focus, .btn.btn-primary:active, .btn.btn-primary:hover {
    outline : 0;
}

@media screen and (max-width : 767px) {
    /********************************
     Form containers rules for mobile
    *********************************/
    /****************************
     Form inputs and label rules
    *****************************/
    input:not([type]),
    input[type=text]:not(.browser-default),
    input[type=password]:not(.browser-default),
    input[type=email]:not(.browser-default),
    input[type=url]:not(.browser-default),
    input[type=time]:not(.browser-default),
    input[type=date]:not(.browser-default),
    input[type=datetime]:not(.browser-default),
    input[type=datetime-local]:not(.browser-default),
    input[type=tel]:not(.browser-default),
    input[type=number]:not(.browser-default),
    input[type=search]:not(.browser-default),
    textarea.materialize-textarea:not(.browser-default) {
        font-size : 14px;
    }
}

.input-field > input[type=date]:not(.browser-default) + label,
.input-field > input[type=time]:not(.browser-default) + label {
    -webkit-transform        : translateY(-14px) scale(0.9);
    transform                : translateY(-14px) scale(0.9);
    -webkit-transform-origin : 0 0;
    transform-origin         : 0 0;
}

.input-field .helper-text {
    position   : relative;
    min-height : 18px;
    display    : block;
    font-size  : 12px;
    color      : rgba(0, 0, 0, 0.54);
}

.input-field .helper-text::after {
    opacity  : 1;
    position : absolute;
    top      : 0;
    left     : 0;
}

.input-field .prefix {
    position           : absolute;
    width              : 3rem;
    font-size          : 2rem;
    -webkit-transition : color .2s;
    transition         : color .2s;
    top                : 0.5rem;
}

.input-field .prefix.active {
    color : #26a69a;
}

.input-field .prefix ~ input,
.input-field .prefix ~ textarea,
.input-field .prefix ~ label,
.input-field .prefix ~ .validate ~ label,
.input-field .prefix ~ .helper-text,
.input-field .prefix ~ .autocomplete-content {
    margin-left : 3rem;
    width       : 92%;
    width       : calc(100% - 3rem);
}

.input-field .prefix ~ label {
    margin-left : 3rem;
}

@media only screen and (max-width : 992px) {
    .input-field .prefix ~ input {
        width : 86%;
        width : calc(100% - 3rem);
    }
}

/*!
 * Waves v0.6.0
 * http://fian.my.id/Waves
 *
 * Copyright 2014 Alfiana E. Sibuea and other contributors
 * Released under the MIT license
 * https://github.com/fians/Waves/blob/master/LICENSE
 */
.waves-effect {
    position                    : relative;
    cursor                      : pointer;
    display                     : inline-block;
    overflow                    : hidden;
    -webkit-user-select         : none;
    -moz-user-select            : none;
    -ms-user-select             : none;
    user-select                 : none;
    -webkit-tap-highlight-color : transparent;
    vertical-align              : middle;
    z-index                     : 1;
    -webkit-transition          : .3s ease-out;
    transition                  : .3s ease-out;
}

.waves-effect .waves-ripple {
    position                    : absolute;
    border-radius               : 50%;
    width                       : 20px;
    height                      : 20px;
    margin-top                  : -10px;
    margin-left                 : -10px;
    opacity                     : 0;
    background                  : rgba(0, 0, 0, 0.2);
    -webkit-transition          : all 0.7s ease-out;
    transition                  : all 0.7s ease-out;
    -webkit-transition-property : opacity, -webkit-transform;
    transition-property         : opacity, -webkit-transform;
    transition-property         : transform, opacity;
    transition-property         : transform, opacity, -webkit-transform;
    -webkit-transform           : scale(0);
    transform                   : scale(0);
    pointer-events              : none;
}

.waves-effect.waves-light .waves-ripple {
    background-color : rgba(255, 255, 255, 0.45);
}

.waves-effect.waves-red .waves-ripple {
    background-color : rgba(244, 67, 54, 0.7);
}

.waves-effect.waves-yellow .waves-ripple {
    background-color : rgba(255, 235, 59, 0.7);
}

.waves-effect.waves-orange .waves-ripple {
    background-color : rgba(255, 152, 0, 0.7);
}

.waves-effect.waves-purple .waves-ripple {
    background-color : rgba(156, 39, 176, 0.7);
}

.waves-effect.waves-green .waves-ripple {
    background-color : rgba(76, 175, 80, 0.7);
}

.waves-effect.waves-teal .waves-ripple {
    background-color : rgba(0, 150, 136, 0.7);
}

.waves-effect input[type="button"], .waves-effect input[type="reset"], .waves-effect input[type="submit"] {
    border         : 0;
    font-style     : normal;
    font-size      : inherit;
    text-transform : inherit;
    background     : none;
}

.waves-effect img {
    position : relative;
    z-index  : -1;
}

.waves-notransition {
    -webkit-transition : none !important;
    transition         : none !important;
}

.waves-circle {
    -webkit-transform  : translateZ(0);
    transform          : translateZ(0);
    -webkit-mask-image : -webkit-radial-gradient(circle, white 100%, black 100%);
}

.waves-input-wrapper {
    border-radius  : 0.2em;
    vertical-align : bottom;
}

.waves-input-wrapper .waves-button-input {
    position : relative;
    top      : 0;
    left     : 0;
    z-index  : 1;
}

.waves-circle {
    text-align         : center;
    width              : 2.5em;
    height             : 2.5em;
    line-height        : 2.5em;
    border-radius      : 50%;
    -webkit-mask-image : none;
}

.waves-block {
    display : block;
}

/* Firefox Bug: link not triggered */
.waves-effect .waves-ripple {
    z-index : -1;
}

/* Datepicker */

.picker {
    font-size           : 16px;
    text-align          : left;
    line-height         : 1.2;
    color               : #000000;
    position            : absolute;
    z-index             : 10000;
    -webkit-user-select : none;
    -moz-user-select    : none;
    -ms-user-select     : none;
    user-select         : none;
}

.picker__input {
    cursor : default;
}

.picker__input.picker__input--active {
    border-color : #0089ec;
}

.picker__holder {
    width                      : 100%;
    overflow-y                 : auto;
    -webkit-overflow-scrolling : touch;
}

/*!
 * Default mobile-first, responsive styling for pickadate.js
 * Demo: http://amsul.github.io/pickadate.js
 */
.picker__holder, .picker__frame {
    bottom : 0;
    left   : 0;
    right  : 0;
    top    : 100%;
}

.picker__holder {
    position                    : fixed;
    transition                  : background 0.15s ease-out, top 0s 0.15s;
    -webkit-backface-visibility : hidden;
}

.picker__frame {
    position     : absolute;
    margin       : 0 auto;
    min-width    : 256px;
    width        : 300px;
    max-height   : 350px;
    -ms-filter   : "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter       : alpha(opacity=0);
    -moz-opacity : 0;
    opacity      : 0;
    transition   : all 0.15s ease-out;
}

@media (min-height : 28.875em) {
    .picker__frame {
        overflow   : visible;
        top        : auto;
        bottom     : -100%;
        max-height : 80%;
    }
}

@media (min-height : 40.125em) {
    .picker__frame {
        margin-bottom : 7.5%;
    }
}

.picker__wrap {
    display : table;
    width   : 100%;
    height  : 100%;
}

@media (min-height : 28.875em) {
    .picker__wrap {
        display : block;
    }
}

.picker__box {
    background     : #ffffff;
    display        : table-cell;
    vertical-align : middle;
}

@media (min-height : 28.875em) {
    .picker__box {
        display             : block;
        border              : 1px solid #777777;
        border-top-color    : #898989;
        border-bottom-width : 0;
        border-radius       : 5px 5px 0 0;
        box-shadow          : 0 12px 36px 16px rgba(0, 0, 0, 0.24);
    }
}

.picker--opened .picker__holder {
    top        : 0;
    background : transparent;
    -ms-filter : "progid:DXImageTransform.Microsoft.gradient(startColorstr=#1E000000,endColorstr=#1E000000)";
    zoom       : 1;
    background : rgba(0, 0, 0, 0.32);
    transition : background 0.15s ease-out;
}

.picker--opened .picker__frame {
    top          : 0;
    -ms-filter   : "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter       : alpha(opacity=100);
    -moz-opacity : 1;
    opacity      : 1;
}

@media (min-height : 35.875em) {
    .picker--opened .picker__frame {
        top    : 10%;
        bottom : auto;
    }
}

.picker__input.picker__input--active {
    border-color : #e3f2fd;
}

.picker__frame {
    margin    : 0 auto;
    max-width : 325px;
}

@media (min-height : 38.875em) {
    .picker--opened .picker__frame {
        top    : 10%;
        bottom : auto;
    }
}

.picker__box {
    padding : 0 1em;
}

.picker__header {
    text-align : center;
    position   : relative;
    margin-top : .75em;
}

.picker__month, .picker__year {
    display      : inline-block;
    margin-left  : .25em;
    margin-right : .25em;
}

.picker__select--month, .picker__select--year {
    height       : 2em;
    padding      : 0;
    margin-left  : .25em;
    margin-right : .25em;
}

.picker__select--month.browser-default {
    display          : inline;
    background-color : #ffffff;
    width            : 40%;
}

.picker__select--year.browser-default {
    display          : inline;
    background-color : #ffffff;
    width            : 26%;
}

.picker__select--month:focus, .picker__select--year:focus {
    border-color : rgba(0, 0, 0, 0.05);
}

.picker__nav--prev, .picker__nav--next {
    position   : absolute;
    padding    : .5em 1.25em;
    width      : 1em;
    height     : 1em;
    box-sizing : content-box;
    top        : -0.25em;
}

.picker__nav--prev {
    left          : -1em;
    padding-right : 1.25em;
}

.picker__nav--next {
    right        : -1em;
    padding-left : 1.25em;
}

.picker__nav--disabled, .picker__nav--disabled:hover, .picker__nav--disabled:before, .picker__nav--disabled:before:hover {
    cursor             : default;
    background         : none;
    border-right-color : #f5f5f5;
    border-left-color  : #f5f5f5;
}

.picker__table {
    text-align      : center;
    border-collapse : collapse;
    border-spacing  : 0;
    table-layout    : fixed;
    font-size       : 1rem;
    width           : 100%;
    margin-top      : .75em;
    margin-bottom   : .5em;
}

.picker__table th, .picker__table td {
    text-align : center;
}

.picker__table td {
    margin  : 0;
    padding : 0;
}

.picker__weekday {
    width          : 14.285714286%;
    font-size      : .75em;
    padding-bottom : .25em;
    color          : #999999;
    font-weight    : 500;
}

@media (min-height : 33.875em) {
    .picker__weekday {
        padding-bottom : .5em;
    }
}

.picker__day--today {
    position       : relative;
    color          : #595959;
    letter-spacing : -.3;
    padding        : .75rem 0;
    font-weight    : 400;
    border         : 1px solid transparent;
}

.picker__day--disabled:before {
    border-top-color : #aaaaaa;
}

.picker__day--infocus:hover {
    cursor      : pointer;
    color       : #000;
    font-weight : 500;
}

.picker__day--outfocus {
    display : none;
    padding : .75rem 0;
    color   : #fff;
}

.picker__day--outfocus:hover {
    cursor      : pointer;
    color       : #dddddd;
    font-weight : 500;
}

.picker__day--highlighted:hover, .picker--focused .picker__day--highlighted {
    cursor : pointer;
}

.picker__day--selected, .picker__day--selected:hover, .picker--focused .picker__day--selected {
    border-radius     : 50%;
    -webkit-transform : scale(0.75);
    transform         : scale(0.75);
    background        : #0089ec;
    color             : #ffffff;
}

.picker__day--disabled, .picker__day--disabled:hover, .picker--focused .picker__day--disabled {
    background   : #f5f5f5;
    border-color : #f5f5f5;
    color        : #dddddd;
    cursor       : default;
}

.picker__day--highlighted.picker__day--disabled, .picker__day--highlighted.picker__day--disabled:hover {
    background : #bbbbbb;
}

.picker__footer {
    text-align              : center;
    display                 : -webkit-flex;
    display                 : -ms-flexbox;
    display                 : flex;
    -webkit-align-items     : center;
    -ms-flex-align          : center;
    align-items             : center;
    -webkit-justify-content : space-between;
    -ms-flex-pack           : justify;
    justify-content         : space-between;
}

.picker__button--today, .picker__button--clear, .picker__button--close {
    border         : 1px solid #ffffff;
    background     : #ffffff;
    font-size      : .8em;
    padding        : .66em 0;
    font-weight    : bold;
    width          : 33%;
    display        : inline-block;
    vertical-align : bottom;
}

.picker__button--today:hover, .picker__button--clear:hover, .picker__button--close:hover {
    cursor              : pointer;
    color               : #000000;
    background          : #b1dcfb;
    border-bottom-color : #b1dcfb;
}

.picker__button--today:focus, .picker__button--clear:focus, .picker__button--close:focus {
    background   : #b1dcfb;
    border-color : rgba(0, 0, 0, 0.05);
    outline      : none;
}

.picker__button--today:before, .picker__button--clear:before, .picker__button--close:before {
    position : relative;
    display  : inline-block;
    height   : 0;
}

.picker__button--today:before, .picker__button--clear:before {
    content      : " ";
    margin-right : .45em;
}

.picker__button--today:before {
    top         : -0.05em;
    width       : 0;
    border-top  : 0.66em solid #0059bc;
    border-left : .66em solid transparent;
}

.picker__button--clear:before {
    top        : -0.25em;
    width      : .66em;
    border-top : 3px solid #ee2200;
}

.picker__button--close:before {
    content        : "\D7";
    top            : -0.1em;
    vertical-align : top;
    font-size      : 1.1em;
    margin-right   : .35em;
    color          : #777777;
}

.picker__button--today[disabled], .picker__button--today[disabled]:hover {
    background   : #f5f5f5;
    border-color : #f5f5f5;
    color        : #dddddd;
    cursor       : default;
}

.picker__button--today[disabled]:before {
    border-top-color : #aaaaaa;
}

.picker__box {
    border-radius : 2px;
    overflow      : hidden;
}

.picker__date-display {
    text-align       : center;
    background-color : #26a69a;
    color            : #fff;
    padding-bottom   : 15px;
    font-weight      : 300;
}

.picker__nav--prev:hover, .picker__nav--next:hover {
    cursor     : pointer;
    color      : #000000;
    background : #a1ded8;
}

.picker__weekday-display {
    background-color : #1f897f;
    padding          : 10px;
    font-weight      : 200;
    letter-spacing   : .5;
    font-size        : 1rem;
    margin-bottom    : 15px;
}

.picker__month-display {
    text-transform : uppercase;
    font-size      : 2rem;
}

.picker__day-display {
    font-size   : 4.5rem;
    font-weight : 400;
}

.picker__year-display {
    font-size : 1.8rem;
    color     : rgba(255, 255, 255, 0.4);
}

.picker__box {
    padding : 0;
}

.picker__calendar-container {
    padding : 0 1rem;
}

.picker__calendar-container thead {
    border : none;
}

.picker__table {
    margin-top    : 0;
    margin-bottom : .5em;
}

.picker__day--infocus {
    color          : #595959;
    letter-spacing : -.3;
    padding        : .75rem 0;
    font-weight    : 400;
    border         : 1px solid transparent;
}

.picker__day.picker__day--today {
    color : #26a69a;
}

.picker__day.picker__day--today.picker__day--selected {
    color : #fff;
}

.picker__weekday {
    font-size : .9rem;
}

.picker__day--selected, .picker__day--selected:hover, .picker--focused .picker__day--selected {
    border-radius     : 50%;
    -webkit-transform : scale(0.9);
    transform         : scale(0.9);
    background-color  : #26a69a;
    color             : #ffffff;
}

.picker__day--selected.picker__day--outfocus, .picker__day--selected:hover.picker__day--outfocus, .picker--focused .picker__day--selected.picker__day--outfocus {
    background-color : #a1ded8;
}

.picker__footer {
    text-align : right;
    padding    : 5px 10px;
}

.picker__close, .picker__today {
    font-size : 1.1rem;
    padding   : 0 1rem;
    color     : #26a69a;
}

.picker__nav--prev:before, .picker__nav--next:before {
    content       : " ";
    border-top    : .5em solid transparent;
    border-bottom : .5em solid transparent;
    border-right  : 0.75em solid #676767;
    width         : 0;
    height        : 0;
    display       : block;
    margin        : 0 auto;
}

.picker__nav--next:before {
    border-right : 0;
    border-left  : 0.75em solid #676767
}

button.picker__today:focus, button.picker__clear:focus, button.picker__close:focus {
    background-color : #a1ded8;
}

.picker__list {
    list-style : none;
    padding    : 0.75em 0 4.2em;
    margin     : 0;
}

.picker__list-item {
    border-bottom : 1px solid #dddddd;
    border-top    : 1px solid #dddddd;
    margin-bottom : -1px;
    position      : relative;
    background    : #ffffff;
    padding       : .75em 1.25em;
}

@media (min-height : 46.75em) {
    .picker__list-item {
        padding : .5em 1em;
    }
}

.picker__list-item:hover {
    cursor       : pointer;
    color        : #000000;
    background   : #b1dcfb;
    border-color : #0089ec;
    z-index      : 10;
}

.picker__list-item--highlighted {
    border-color : #0089ec;
    z-index      : 10;
}

.picker__list-item--highlighted:hover, .picker--focused .picker__list-item--highlighted {
    cursor     : pointer;
    color      : #000000;
    background : #b1dcfb;
}

.picker__list-item--selected, .picker__list-item--selected:hover, .picker--focused .picker__list-item--selected {
    background : #0089ec;
    color      : #ffffff;
    z-index    : 10;
}

.picker__list-item--disabled, .picker__list-item--disabled:hover, .picker--focused .picker__list-item--disabled {
    background   : #f5f5f5;
    border-color : #f5f5f5;
    color        : #dddddd;
    cursor       : default;
    border-color : #dddddd;
    z-index      : auto;
}

.picker--time .picker__button--clear {
    display        : block;
    width          : 80%;
    margin         : 1em auto 0;
    padding        : 1em 1.25em;
    background     : none;
    border         : 0;
    font-weight    : 500;
    font-size      : .67em;
    text-align     : center;
    text-transform : uppercase;
    color          : #666;
}

.picker--time .picker__button--clear:hover, .picker--time .picker__button--clear:focus {
    color        : #000000;
    background   : #b1dcfb;
    background   : #ee2200;
    border-color : #ee2200;
    cursor       : pointer;
    color        : #ffffff;
    outline      : none;
}

.picker--time .picker__button--clear:before {
    top         : -0.25em;
    color       : #666;
    font-size   : 1.25em;
    font-weight : bold;
}

.picker--time .picker__button--clear:hover:before, .picker--time .picker__button--clear:focus:before {
    color : #ffffff;
}

.picker--time .picker__frame {
    min-width : 256px;
    max-width : 320px;
}

.picker--time .picker__box {
    font-size  : 1em;
    background : #f2f2f2;
    padding    : 0;
}

@media (min-height : 40.125em) {
    .picker--time .picker__box {
        margin-bottom : 5em;
    }
}