.cmsmasters_search_slide {
    position: relative;

    .cmsmasters_search_form_skin_slide_search &,
    .cmsmasters_search_form_skin_slide_search_minimal & {
        display: flex;

        .cmsmasters_search_form {
            display: flex;
        }

        .cmsmasters_search_slide_close {
            display: flex;
            justify-content: center;
            align-items: center;
            white-space: nowrap;
        }

        .cmsmasters_search_form_container {
            visibility: hidden;
            position: absolute;
            z-index: 2;
            top: -999em;
            left: -999em;
            width: 100%;
            height: 100%;
            opacity: 0;
            transition: opacity 200ms linear, transform 200ms linear, top 200ms linear;

            &.cmsmasters_form_relative_to_button {
                width: auto;
            }

            &.cmsmasters_form_relative_to_block {
                left: 0;
            }

            &.active {
                top: 0;
                opacity: 1;
            }

            &.cmsmasters_out {
                opacity: 0;
            }

            &.cmsmasters_in {
                opacity: 1;
            }

            &.active,
            &.cmsmasters_out,
            &.cmsmasters_in {
                visibility: visible;
                top: 0;
                left: 0;
            }

            &.cmsmasters_search_popup-none-effect {
                transition: none;
            }

            &.cmsmasters_search_popup-move-up-effect {
                transform: translateY( 20px );
                transition: opacity 200ms linear, transform 200ms linear;

                &.active {
                    transform: translateY( 0 );
                }

                &.cmsmasters_out {
                    transform: translateY( 20px );
                }

                &.cmsmasters_in {
                    transform: translateY( 0 );
                }
            }

            &.cmsmasters_search_popup-move-down-effect {
                transform: translateY( -20px );
                transition: opacity 200ms linear, transform 200ms linear;

                &.active {
                    transform: translateY( 0 );
                }

                &.cmsmasters_out {
                    transform: translateY( -20px );
                }

                &.cmsmasters_in {
                    transform: translateY( 0 );
                }
            }

            &.cmsmasters_search_popup-move-left-effect {
                transform: translateX( 50px );
                transition: opacity 200ms linear, transform 200ms linear;

                &.active {
                    transform: translateX( 0 );
                }

                &.cmsmasters_out {
                    transform: translateX( 50px );
                }

                &.cmsmasters_in {
                    transform: translateX( 0 );
                }
            }

            &.cmsmasters_search_popup-move-right-effect {
                transform: translateX( -50px );
                transition: opacity 200ms linear, transform 200ms linear;

                &.active {
                    transform: translateX( 0 );
                }

                &.cmsmasters_out {
                    transform: translateX( -50px );
                }

                &.cmsmasters_in {
                    transform: translateX( 0 );
                }
            }

            &.cmsmasters_search_popup-fade-effect {
                transition: opacity 200ms linear;
            }

            &.cmsmasters_search_popup-scale-effect {
                transform: scale(0);
                transition: opacity 200ms linear, transform 200ms linear;

                &.active {
                    transform: scale(1);
                }

                &.cmsmasters_out {
                    transform: scale(0);
                }

                &.cmsmasters_in {
                    transform: scale(1);
                }
            }

            .cmsmasters_search_form_container_inner {
                width: 100%;
                height: 100%;
                display: flex;
                justify-content: center;
                align-items: center;
                position: relative;
                box-sizing: content-box;
                border: 2px solid #000;

                .cmsmasters_search_field {
                    height: 100%;
                }
            }
        }
    }

    .cmsmasters_search_slide_button,
    .cmsmasters_search_button_slide_full {
        display: flex;
        justify-content: center;
        cursor: pointer;
        transition: all 0.3s ease;

        .cmsmasters_search_slide_icon,
        .cmsmasters_search_slide_label {
            display: flex;
            align-items: center;
        }

        .cmsmasters_slide_trigger_icon_right & {
            .cmsmasters_search_slide_label,
            .cmsmasters_search_slide_label_close {
                order: -1;
            }
        }
    }

    .cmsmasters_search_slide_close {
        display: flex;
        justify-content: center;
        cursor: pointer;
        transition: all 0.3s ease;

        .cmsmasters_slide_trigger_icon_right & {
            .cmsmasters_search_close_label {
                order: -1;
            }
        }
    }

    .cmsmasters_search_form_skin_slide_search & {
        .cmsmasters_search_form_container {
            width: calc(100vw - 17px);
            top: auto;
            left: -999em;
            right: auto;
            bottom: auto;
            justify-content: center;
            z-index: 9998;

            &.active,
            &.cmsmasters_out,
            &.cmsmasters_in {
                top: 100%;
            }

            .cmsmasters_search_form_container_inner {
                // width: 500px;
                width: 100%;
                display: flex;
                justify-content: center;
                position: relative;
            }
        }

        .cmsmasters_search_button_slide_full {
            .cmsmasters_search_slide_icon_close,
            .cmsmasters_search_slide_label_close {
                display: none;
            }

            &.active {
                .cmsmasters_search_slide_icon,
                .cmsmasters_search_slide_label {
                    display: none;
                }

                .cmsmasters_search_slide_icon_close,
                .cmsmasters_search_slide_label_close {
                    display: block;
                }
            }
        }
    }

    button,
    input[type=search] {
        margin: 0;
        border: 0;
        padding: 0;
        display: inline-block;
        vertical-align: middle;
        white-space: normal;
        line-height: 1;
        font-size: 15px;
        -webkit-appearance: none;
        -moz-appearance: none;
    }

    .cmsmasters_input_icon {
        font-size: 17px;
        color: #000000;
        display: flex;
        align-items: center;
        position: absolute;
        left:0;
        top: 0;
        bottom: 0;
    }

    .cmsmasters_search_form_icon {
        display: flex;
        align-items: center;
        top: 0;
        bottom: 0;
        right: 20px;
        background: transparent;
        color: #000;
        position: absolute;
    }

    .cmsmasters_search_submit {
        display: flex;
        justify-content: center;
        align-items: center;
        white-space: nowrap;
        border-radius: 0;

        .cmsmasters_search_submit_label {
            .cmsmasters_search_text_btn_left & {
                order: -1;
            }
        }
    }

    .cmsmasters_search_field {
        -webkit-flex-basis: 100%;
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        color: #55595c;
        -webkit-transition: color .2s;
        -o-transition: color .2s;
        transition: color .2s;
    }

    .cmsmasters_search_field::placeholder {
        color:#c1c1c1;
    }

    .cmsmasters_search_field::-webkit-input-placeholder {
        color:#c1c1c1;
    }

    .cmsmasters_search_field::-moz-placeholder {
        color:#c1c1c1;
    }

    .cmsmasters_search_field:-ms-input-placeholder {
        color:#c1c1c1;
    }

    .cmsmasters_search_field::-ms-input-placeholder {
        color:#c1c1c1;
    }

    .cmsmasters_search_form_container {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        align-items: center;
        position: relative;
        -webkit-transition: .2s;
        -o-transition: .2s;
        transition: .2s;
        border: 0 solid transparent;
        min-height: 20px;
    }

    &.cmsmasters_search_popup-active {
        .cmsmasters_search_popup-full-screen {
            -webkit-transform: scale(1);
            -ms-transform: scale(1);
            transform: scale(1);
        }
    }
}