﻿
#callMeBackForm .submit-success-message {
    color: white !important;
}
#callMeBackForm .formbutton {
    margin-left: 0 !important;
    margin-top:15px !important;
}
.call-me-back-container {
    display: none;
    display: flex;
    position: relative;
    /* height: 40px; */
    top: 20px;
    background: black;
    padding-top: 10px;
    padding-bottom: 10px;
    border-left: 1px solid white;
    border-bottom: 2px solid white;
    /* width: 100%; */
    width: calc(100% + 42px);
    /* border-top: 1px solid white; */
}
.callme-back-link-wrapper
{
    display:none;
}
.callme-back-link-wrapper-inner {
    color: white;
    padding-left: calc((100% / 12) * 3.5);
}



    .callme-back-link-wrapper-inner a {
        color: #00AEEF;
        text-decoration: none;
         
        padding-left: 10px;
        
       
    }
.call-me-back-container {
    cursor: pointer;
}

.call-me-back-form-show {
    right:0;
    /*visibility: visible;
    opacity: 1;
    left: calc(100% - ( ((((100% - 80px ) / 12) * 9) / 6 ) + 83px ) );*/
        /*left: calc(100% - ( ((((100% - 80px ) / 12) * 9) / 6 ) + 83px ) );*/
        animation: 0.35s 1 linear forwards showForm;
    }

.call-me-back-form form .errorMessage {
    margin-top: 5px;
    padding-top:0 !important;
}
.call-me-back-form form .errorDisplay {
    margin-top: 5px !important;
    padding-top: 0 !important;
    margin-bottom: 2px !important;
    /* padding-bottom: 0px; */
}
.call-me-back-form-hide {
    visibility: hidden;
    opacity: 0;
    top:-999px;
    transition: all 1s cubic-bezier(0.46, 0.03, 0.52, 0.96);
    /*animation: 1s 1 cubic-bezier(0.46, 0.03, 0.52, 0.96) backwards showForm;*/
}
.callMeBackFormButton.button-effects-loading {
    width: calc( (100% / 12) * 12) !important;
}
.call-me-back-container-closed{
    opacity: 0.75;
}
.call-me-back-container-closed * {
    opacity: 0.75;
}
.call-me-back-container-open {
    opacity: 1;
}

    .call-me-back-container-open * {
        opacity:1;
    }
.call-me-back-inner-text {
    position: relative;
    left: calc(((100% / 12) * 4 ) - 5px);
}

.call-me-back-inner-btn {
    position: relative;
    left: calc(100% - 116px) !important;
}


.verticalLine .w3-bar-item {
     padding-top: 42px; 
    /* margin-top: 24px; */
}

.verticalLine {
    height: 164px !important;
}

.call-me-back-inner-btn:before {
}

.call-me-back-inner-btn-anime {
    content: ') ) )';
    color: white;
}

.call-me-back-inner-btn-anime {
    display: flex;
    position: relative;
    left: 55px;
    bottom: 10px;
    transform: rotate(30deg);
}

.call-me-back-inner-btn-anime-big {
    font-size: 14px;
}

.call-me-back-inner-btn-anime-mid {
    padding-top: 2px;
    font-size: 12px;
}

.call-me-back-inner-btn-anime-small {
    font-size: 10px;
    padding-top: 2px;
}




.call-me-back-form {
    background: black !important;
    border: 1px solid white;
    box-shadow: -3px 1px 2px white;
    min-height: 200px;
    z-index: 9;
    display: flex;
    border-top: 1px white solid;
    width: calc(((((100% - 75px ) / 12) * 2) + 28px ) );
    position: fixed;
    top: 165px;
}

    .call-me-back-form form {
        padding-left: calc(100% / 12);
        /* background: white !important; */
    }

        .call-me-back-form form .chk-lck-general-contact-form-row-1 {
            background: transparent !important;
            min-height: 30px;
            padding-top: 0px !important;
            padding-bottom: 0px !important;
        }

            .call-me-back-form form .chk-lck-general-contact-form-row-1 div {
                background: transparent !important;
                padding-top: 0px !important;
                padding-bottom: 0px !important;
                /* max-height: 66px; */
            }

form#callMeBackForm input {
    min-height: 30px;
    margin-bottom: 0px !important;
}

.call-me-back-form form .placeholder {
    /* top: 16px !important; */
    /* top: calc(((100% / 10) * 5 ) - 29px) !important; */
}

.call-me-back-form .placeholder-wrapper {
    top: calc(((100% / 10) * 5 ) - -10px) !important;
}

.call-me-back-nofe .placeholder {
}

.call-me-back-nofe .placeholder-wrapper {
    /* top: 1px !important; */
    top: calc(((100% / 10) * 5 ) - 15px) !important;
}

form#callMeBackForm textarea {
    margin-bottom: 0px !important;
}

    form#callMeBackForm textarea input {
        margin-bottom: 0px !important;
    }

form#callMeBackForm .chk-lck-general-contact-form-button-wrapper {
    padding-left: calc(100% / 12 - 2px);
}





.call-me-back-inner-btn-closed i {
    animation: 1s 1 cubic-bezier(0.46, 0.03, 0.52, 0.96) forwards showElem;
    animation-delay: 1s;
    padding-top: 5px;

}

.call-me-back-inner-btn-open i {
    display: none;
}

.call-me-back-inner-btn-closed .slash-l {
    animation: 1s 1 cubic-bezier(0.46, 0.03, 0.52, 0.96) backwards fromPhoneToX_L;
    display: none;
}

.call-me-back-inner-btn-closed .slash-r {
    animation: 1s 1 cubic-bezier(0.46, 0.03, 0.52, 0.96) backwards fromPhoneToX_R;
    display: none;
}



.call-me-back-inner-btn-open .slash-l {
    display: flex;
    animation: 1s 1 cubic-bezier(0.46, 0.03, 0.52, 0.96) forwards fromPhoneToX_L;
}

.call-me-back-inner-btn-open .slash-r {
    display: flex;
    animation: 1s 1 cubic-bezier(0.46, 0.03, 0.52, 0.96) forwards fromPhoneToX_R;
    /* padding-top: 28px; */
    /* margin-left: 6px; */
}

.call-me-back-inner-btn.call-me-back-inner-btn-open {
    display: flex;
}

@keyframes fromPhoneToX_R {
    0% {
        width: 4px;
        height: 25px;
    }

    25% {
        position: relative;
        left: 12px;
    }

    55% {
        background: #00AEEF;
    }

    65% {
        transform: rotate(135deg);
    }

    90% {
        left: 0px;
    }

    100% {
        transform: rotate(135deg);
        width: 4px;
        height: 25px;
        background: #00AEEF;
        /*margin-right: -4px;
        padding-left: -5px;*/
    }
}

@keyframes fromPhoneToX_L {
    0% {
        width: 4px;
        height: 25px;
    }

    25% {
        position: relative;
        right: 30px;
    }

    55% {
        background: #00AEEF;
    }

    65% {
        transform: rotate(45deg);
    }

    90% {
        right: 0px;
    }

    100% {
        transform: rotate(45deg);
        width: 4px;
        height: 25px;
        background: #00AEEF;
        margin-right: -4px;
        padding-left: -5px;
    }
}

@keyframes showElem {
    0% {
    }


    100% {
        display: unset;
    }
}

@keyframes showForm {
    0% {
        visibility: visible;
        opacity: 0.15;
    }

    25% {
        visibility: visible;
        opacity: 0.3;
         
    
    }

    40% {
        visibility: visible;
        opacity: 0.65;
         
         
    }

    55% {
        visibility: visible;
        opacity: 0.75;
         
       
    }

    70% {
        visibility: visible;
        opacity: 0.75;
        top: 165px;
    }

    100% {
        visibility: visible;
        opacity: 1;
        top:165px;
        transform: rotateY(0);
    }
}


/*maybe transfer*/

.general-contact-errored .placeholder-wrapper {
    /* margin-top: 0px; */
    top: calc(((100% / 10) * 5 ) - 10px) !important;
}

    .general-contact-errored .placeholder-wrapper .placeholder-star {
        color: black;
    }
.contactselect .errorMessage {
    margin-top: -15px !important;
}
/*.chk-lck-general-contact-form-row-1.general-contact-errored {
    margin-top: -10px;
}*/

.callMeBackFormButton {
    margin-top: 15px;
}

.submit-success-message {
 
    color: white;
}

.errored-message {
    color: red !important;
    font-weight: 900;
    font-size: 14px !important;
}

.call-me-back-form .placeholder-wrapper {
    top: 48px !important;
}


.chk-offwhite.call-me-back-nofe .placeholder-wrapper {
    /* position: relative; */
    top: 50px !important;
}

/*media*/
.call-me-back-form {
    width: calc(((100% / 12) * 2 ) + 10px ) !important;
}
@media (min-width:2001px) {
    .call-me-back-form {
        width: calc(((2000px / 12) * 2) + 5px ) !important;
    }
}



@media (min-width:994px) and (max-width:1279px) {

    .placeholder-wrapper {
        font-size: 0.8em;
        margin-bottom: 4px;
    }
    .call-me-back-inner-text {
        left: calc(((100% / 12) * 4 ) - 22px) !important;
    }
    .call-me-back-inner-btn {
       
        left: calc(100% - 122px) !important;
    }
}

    @media (min-width:922px) and (max-width:993px) {
        .call-me-back-form.chk-lck-general-contact-form.chk-lck-general-contact-form-black.chk-lck-general-contact-form-small.call-me-back-form-show {
            left: calc(100% - ( (100% / 12)  * 4) + -10px ) !important;
            width: calc(100% - ( (100% / 12)  * 8) + 10px ) !important;
        }

        .callMeBackFormButton {
            width: 100% !important;
        }


        .call-me-back-inner-text {
            left: calc(((100%/12) * 4 ) - 4px) !important;
        }

        .call-me-back-inner-btn.call-me-back-inner-btn-open {
            left: calc(100% - 115px) !important;
            /* left: calc(((100%/12) * 7) + 20px); */
            /* width: calc(100% + 42px); */
        }

        .call-me-back-inner-btn {
            left: calc(100% - 122px) !important;
            /* left: calc(((100%/12) * 7) + 20px); */
            /* width: calc(100% + 42px); */
        }

        .call-me-back-form-show {
            left: calc(100% - ( (100% / 12)  * 4) - 10px ) !important;
        }

        @keyframes showForm {
            0% {
                visibility: visible;
                opacity: 0.15;
            }



            35% {
                visibility: visible;
                opacity: 0.75;
            }

            70% {
                visibility: visible;
                opacity: 0.75;
                top: 165px;
            }

            100% {
                visibility: visible;
                opacity: 1;
                top: 165px;
            }
        }
    }


    @media (min-width:872px) and (max-width:921px) {
        .call-me-back-form.chk-lck-general-contact-form.chk-lck-general-contact-form-black.chk-lck-general-contact-form-small.call-me-back-form-show {
            left: calc(100% - ( (100% / 12)  * 4) + -10px ) !important;
            width: calc(100% - ( (100% / 12)  * 8) + 10px ) !important;
        }

        .callMeBackFormButton {
            width: 100% !important;
        }


        .call-me-back-inner-text {
            left: calc(((100%/12) * 4 ) -4px) !important;
        }

        .call-me-back-inner-btn.call-me-back-inner-btn-open {
            left: calc(100% - 115px) !important;
            /* left: calc(((100%/12) * 7) + 20px); */
            /* width: calc(100% + 42px); */
        }

        .call-me-back-inner-btn {
            left: calc(100% - 122px) !important;
            /* left: calc(((100%/12) * 7) + 20px); */
            /* width: calc(100% + 42px); */
        }

        .call-me-back-form-show {
            left: calc(100% - ( (100% / 12)  * 4) - 10px ) !important;
        }

        @keyframes showForm {
            0% {
                visibility: visible;
                opacity: 0.15;
            }



            35% {
                visibility: visible;
                opacity: 0.75;
            }

            70% {
                visibility: visible;
                opacity: 0.75;
                top: 165px;
            }

            100% {
                visibility: visible;
                opacity: 1;
                top: 165px;
            }
        }
    }

    @media (min-width:811px) and (max-width:871px) {
        .call-me-back-form.chk-lck-general-contact-form.chk-lck-general-contact-form-black.chk-lck-general-contact-form-small.call-me-back-form-show {
            left: calc(100% - ( (100% / 12)  * 4) + -10px ) !important;
            width: calc(100% - ( (100% / 12)  * 8) + 10px ) !important;
        }

        .callMeBackFormButton {
            width: 100% !important;
        }


        .call-me-back-inner-text {
            left: calc(((100%/12) * 4 ) - 10px) !important;
        }

        .call-me-back-inner-btn.call-me-back-inner-btn-open {
            left: calc(100% - 115px) !important;
            /* left: calc(((100%/12) * 7) + 20px); */
            /* width: calc(100% + 42px); */
        }

        .call-me-back-inner-btn {
            left: calc(100% - 122px) !important;
            /* left: calc(((100%/12) * 7) + 20px); */
            /* width: calc(100% + 42px); */
        }

        .call-me-back-form-show {
            left: calc(100% - ( (100% / 12)  * 4) - 10px ) !important;
        }

        @keyframes showForm {
            0% {
                visibility: visible;
                opacity: 0.15;
            }



            35% {
                visibility: visible;
                opacity: 0.75;
            }

            70% {
                visibility: visible;
                opacity: 0.75;
                top: 165px;
            }

            100% {
                visibility: visible;
                opacity: 1;
                top: 165px;
            }
        }
    }

    @media (min-width:701px) and (max-width:810px) {
        .call-me-back-form.chk-lck-general-contact-form.chk-lck-general-contact-form-black.chk-lck-general-contact-form-small.call-me-back-form-show {
            left: calc(100% - ( (100% / 12)  * 4) + -10px ) !important;
            width: calc(100% - ( (100% / 12)  * 8) + 10px ) !important;
        }

        .callMeBackFormButton {
            width: 100% !important;
        }


        .call-me-back-inner-text {
            left: calc(((100%/12) * 4 ) + 8px) !important;
        }

        .call-me-back-inner-btn.call-me-back-inner-btn-open {
            left: calc(100% - 115px) !important;
            /* left: calc(((100%/12) * 7) + 20px); */
            /* width: calc(100% + 42px); */
        }

        .call-me-back-inner-btn {
            left: calc(100% - 122px) !important;
            /* left: calc(((100%/12) * 7) + 20px); */
            /* width: calc(100% + 42px); */
        }

        .call-me-back-form-show {
            left: calc(100% - ( (100% / 12)  * 4) - 10px ) !important;
        }

        @keyframes showForm {
            0% {
                visibility: visible;
                opacity: 0.15;
            }



            35% {
                visibility: visible;
                opacity: 0.75;
            }

            70% {
                visibility: visible;
                opacity: 0.75;
                top: 165px;
            }

            100% {
                visibility: visible;
                opacity: 1;
                top: 165px;
            }
        }
    }


    @media (min-width:651px) and (max-width:700px) {
        .call-me-back-form.chk-lck-general-contact-form.chk-lck-general-contact-form-black.chk-lck-general-contact-form-small.call-me-back-form-show {
            left: calc(100% - ( (100% / 12)  * 4) + -10px ) !important;
            width: calc(100% - ( (100% / 12)  * 8) + 10px ) !important;
        }

        .callMeBackFormButton {
            width: 100% !important;
        }


        .call-me-back-inner-text {
            left: calc(((100%/12) * 4 ) + 5px) !important;
        }

        .call-me-back-inner-btn.call-me-back-inner-btn-open {
            left: calc(100% - 115px) !important;
            /* left: calc(((100%/12) * 7) + 20px); */
            /* width: calc(100% + 42px); */
        }

        .call-me-back-inner-btn {
            left: calc(100% - 122px) !important;
            /* left: calc(((100%/12) * 7) + 20px); */
            /* width: calc(100% + 42px); */
        }

        .call-me-back-form-show {
            left: calc(100% - ( (100% / 12)  * 4) - 10px ) !important;
        }

        @keyframes showForm {
            0% {
                visibility: visible;
                opacity: 0.15;
            }



            35% {
                visibility: visible;
                opacity: 0.75;
            }

            70% {
                visibility: visible;
                opacity: 0.75;
                top: 165px;
            }

            100% {
                visibility: visible;
                opacity: 1;
                top: 165px;
            }
        }
    }


    @media (min-width:601px) and (max-width:650px) {
        .call-me-back-form.chk-lck-general-contact-form.chk-lck-general-contact-form-black.chk-lck-general-contact-form-small.call-me-back-form-show {
            left: calc(100% - ( (100% / 12)  * 4) + -10px ) !important;
            width: calc(100% - ( (100% / 12)  * 8) + 10px ) !important;
        }

        .callMeBackFormButton {
            width: 100% !important;
        }


        .call-me-back-inner-text {
            left: calc(((100%/12) * 4 ) + 2px) !important;
        }

        .call-me-back-inner-btn.call-me-back-inner-btn-open {
            left: calc(100% - 115px) !important;
            /* left: calc(((100%/12) * 7) + 20px); */
            /* width: calc(100% + 42px); */
        }

        .call-me-back-inner-btn {
            left: calc(100% - 122px) !important;
            /* left: calc(((100%/12) * 7) + 20px); */
            /* width: calc(100% + 42px); */
        }

        .call-me-back-form-show {
            left: calc(100% - ( (100% / 12)  * 4) + -10px ) !important;
        }

        @keyframes showForm {
            0% {
                visibility: visible;
                opacity: 0.15;
            }



            35% {
                visibility: visible;
                opacity: 0.75;
            }

            70% {
                visibility: visible;
                opacity: 0.75;
                top: 165px;
            }

            100% {
                visibility: visible;
                opacity: 1;
                top: 165px;
            }
        }
    }

    @media (max-width:600px) {
        .callme-back-link-wrapper {
            display: block;
        }

        .call-me-back-container-closed {
            opacity: 1;
        }

            .call-me-back-container-closed * {
                opacity: 1;
            }

        .call-me-back-inner-text {
            display: none;
        }

        .call-me-back-container {
            background: transparent;
            border: 0;
        }

        .call-me-back-inner-btn-closed {
            top: -76px;
            left: calc( ((100% / 12 ) * 8 ) + 15px ) !important;
            font-size: 20px;
        }

        .call-me-back-inner-btn {
            left: calc( ((100% / 12 ) * 7 ) + 35px) !important;
            top: -75px;
            font-size: 20px;
        }

        .call-me-back-inner-btn-open {
            left: calc( ((100% / 12 ) * 8 ) ) !important;
            top: -87px;
            left: 70px;
            border: 1px solid white;
            padding-left: 30px;
            padding-right: 30px;
            padding-top: 10px;
            padding-bottom: 26px;
            background: black;
            border-bottom: 0px;
            transition: 0.3s all linear;
        }


        header {
        }

        .mobile-callmeback-form-open {
            border-bottom: 2px solid white;
        }

        .call-me-back-form-show {
            top: 118px;
            width: 100%;
            left: 0 !important;
            height: 100%;
        }

            .call-me-back-form-show input {
            }

        .call-me-back-form form .chk-lck-general-contact-form-row-1 div {
            padding-left: calc( (100% / 12 ) * 0.5) !important;
            margin-left: 0 !important;
            width: calc( (100% / 12 ) * 11) !important;
        }

        .w3-col.l11.m11.s12.chk-lck-general-contact-form-row-1 {
            margin-left: 0 !important;
        }

        .contactselect select {
            width: 100% !important;
            max-width: 100% !important;
            min-width: 100% !important;
        }

        form#callMeBackForm .chk-lck-general-contact-form-button-wrapper {
            max-width: calc((100% / 12 ) * 10);
            margin-left: calc((100% / 12 ) * 0.5 );
        }

        .slash-l {
            width: 3px;
            height: 30px;
        }

        .slash-r {
            width: 3px;
            height: 30px;
        }


        @keyframes showForm {
            0% {
                visibility: visible;
                opacity: 0.15;
            }



            35% {
                visibility: visible;
                opacity: 0.75;
            }

            70% {
                visibility: visible;
                opacity: 0.75;
                top: 118px;
            }

            100% {
                visibility: visible;
                opacity: 1;
                top: 118px;
            }
        }


        @keyframes fromPhoneToX_R {
            0% {
                width: 3px;
                height: 30px;
            }

            25% {
                position: relative;
                left: 12px;
            }

            55% {
                background: #00AEEF;
            }

            65% {
                transform: rotate(135deg);
            }

            90% {
                left: 0px;
            }

            100% {
                transform: rotate(135deg);
                width: 3px;
                height: 30px;
                background: #00AEEF;
                /*margin-right: -4px;
        padding-left: -5px;*/
            }
        }

        @keyframes fromPhoneToX_L {
            0% {
                width: 3px;
                height: 30px;
            }

            25% {
                position: relative;
                right: 30px;
            }

            55% {
                background: #00AEEF;
            }

            65% {
                transform: rotate(45deg);
            }

            90% {
                right: 0px;
            }

            100% {
                transform: rotate(45deg);
                width: 3px;
                height: 30px;
                background: #00AEEF;
                margin-right: -4px;
                padding-left: -5px;
            }
        }
		
		 .call-me-back-form {
               width: 100% !important;
							}     
    }

    @media (min-width:501px) and (max-width:550px) {
        .call-me-back-inner-btn.call-me-back-inner-btn-open {
            left: calc( ((100% / 12 ) * 6.5 ) ) !important;
            top: -87px;
            left: 70px;
            border: 1px solid white;
            padding-left: 30px;
            padding-right: 30px;
            padding-top: 10px;
            padding-bottom: 26px;
            background: black;
            border-bottom: 0px;
            transition: 0.3s all linear;
        }

        .call-me-back-inner-btn {
            top: -76px;
            left: calc( ((100% / 12 ) * 7.5 ) + 15px ) !important;
            font-size: 20px;
        }
    }

    @media (min-width:451px) and (max-width:500px) {
        .call-me-back-inner-btn.call-me-back-inner-btn-open {
            left: calc( ((100% / 12 ) * 6 ) ) !important;
            top: -87px;
            left: 70px;
            border: 1px solid white;
            padding-left: 30px;
            padding-right: 30px;
            padding-top: 10px;
            padding-bottom: 26px;
            background: black;
            border-bottom: 0px;
            transition: 0.3s all linear;
        }

        .call-me-back-inner-btn {
            left: calc( ((100% / 12 ) * 7 ) + 15px ) !important;
        }
    }




    @media (max-width:450px) {
        .call-me-back-inner-btn {
            
            top: -77px !important;
           
        }
        .verticalLine {
            top: -22px !important;
        }

        .call-me-back-inner-btn-open {
            top: -37px !important;
            left: calc( ( 100% / 12 ) - 13px ) !important;
            padding-bottom: 16px;
        }

        .call-me-back-inner-btn-closed {
            top: -37px !important;
            left: calc(((100% / 12 ) * 1 ) + 3px) !important;
        }

        .call-me-back-container-closed {
            opacity: 1;
        }

            .call-me-back-container-closed * {
                opacity: 1;
            }
    }