:root {
    --color-white: #ffffff;
    --color-black: #000000;
    --color-red: #FF2D16;
    --color-reddark: #8d2419;
    --color-grey: #5a5a5a;
    --color-greytext: #D3D3D3;
    --color-greybg: #D8D8D8;
    --color-greyinput: #CED4D7;
    --color-greytext2: #7E8B95;
    --color1: #B1A295;
    --color2: #A28F80;
    --color3: #C57B58;
    --color4: #253746;
    --color5: #061F31;
    --color6: #33AAAC;
    --color-bg: #ffffff;
    --color-bg1: #F5F8F8;
    --color-bg2: #E6ECED;
    --color-bg3: #edf4f5;
    --height-header: 50px;
    --height-footer: 385px;
    --width-wrapper: calc(100% - 260px);
    --width-max: 1600px;
    --swiper-navigation-size: 30px;
    --swiper-navigation-top-offset: 50%;
    --swiper-navigation-sides-offset: 10px;
    --swiper-navigation-color: var(--color-white);
    --swiper-pagination-color: var(--color-white);
    --swiper-pagination-left: auto;
    --swiper-pagination-right: 8px;
    --swiper-pagination-bottom: 8px;
    --swiper-pagination-top: auto;
    --swiper-pagination-fraction-color: inherit;
    --swiper-pagination-progressbar-bg-color: rgba(255, 255, 255, 0.25);
    --swiper-pagination-progressbar-size: 4px;
    --swiper-pagination-bullet-size: 12px;
    --swiper-pagination-bullet-width: 12px;
    --swiper-pagination-bullet-height: 12px;
    --swiper-pagination-bullet-inactive-color: var(--color-white);
    --swiper-pagination-bullet-inactive-opacity: 0.3;
    --swiper-pagination-bullet-opacity: 1;
    --swiper-pagination-bullet-horizontal-gap: 8px;
    --swiper-pagination-bullet-vertical-gap: 8px;

}

body {
    font-family: univia-pro, sans-serif !important;
    font-weight: normal;
    color: #253746;
    font-size: 15px;
    line-height: 1.5;
    background-color: var(--color-bg3) !important;
}

.container-fluid {
    height: 100%;
    min-height: 100%;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;

    .row {

        height: 100%;
        min-height: 100%;
        /*padding: 10px 0;*/

        .col-picture {
            background-image: url(../pictures/background.jpg);
            background-position: center center;
            background-repeat: no-repeat;
            background-size: cover;
            height: 100%;
            min-height: 100%;
            position: fixed;

        }

        .col-form {
            background-color: #edf4f5;
            padding: 0 71px;

            .title {
                margin: 17vh 0 40px 0;
                font-size: 3rem;
                font-weight: 500;
                padding: 0;
            }

            .logo {
                height: auto;
                width: calc(100% - 49.7vw);
                background-color: var(--color-white);
                padding: 2.5rem 4.5rem;
                position: fixed;
                top: 0;
                right: 0;
                z-index: 1;
                display: flex;
                justify-content: start;

                img {
                    /*width: calc(100% - 30vw);*/
                    height: 3vh;
                }
            }

            p {
                font-size:  16px !important;
            }


        }
    }

    .clickdform
    {

        select {

            border: 1px solid var(--color4) ;
            /*-moz-appearance: none !important;*/
            appearance: none ;
            flex: 1 ;
            cursor: pointer ;
            background-color: transparent !important;
            padding: 12px 50px 12px 30px ;
            border-radius: 26px ;
            color: var(--color4) ;
            width: 100% ;
            font-family: inherit ;
            font-size: 100% ;
            line-height: 1.5 ;
            margin: 0 ;
            height: 50px;

            option {
                background-color: var(--color-bg3) !important;
            }

            &:focus {
                box-shadow: none !important;
                border: 1px solid var(--color4) ;
            }
        }

        div:has(> select) {
            position: relative;
            display: flex;
            align-items: center;
            flex-direction: column;

            &:hover {
                select {
                    background-color: var(--color4) !important;
                    color: var(--color-white) !important;

                    option {
                        background-color: var(--color4) !important;
                        color: var(--color-white) !important;
                    }
                }

            }
            &::after {
                position: absolute !important;
                content: url(../pictures/arrow_dn_orange.svg) !important;
                right: 25px !important;
                width: 13px !important;
                transform-origin: 7px 15px !important;
                transition: all .3s !important;
                pointer-events: none !important;
                line-height: 2.5;

            }

            .requiredInfo {
                width: 100%;
            }
        }

        [type="text"], [type="email"]  {

            font-size: 1.2rem !important;
            line-height: 1.5 !important;
            border: 0 !important;
            font-family: "univia-pro", sans-serif !important;
            font-weight: 400 !important;
            font-style: normal !important;
            background-color: var(--color-greyinput) !important;
            border-radius: 26px !important;
            padding: 11px 50px 11px 30px !important;
            height: 47px ;
            color: var(--color-greytext2);
            text-transform: capitalize;

            &:focus {
                box-shadow: none !important;
            }

            &:-webkit-autofill:focus {
                background-color: #edf4f5 !important;
            }
        }

        .buttonContainer {

            margin: 5vh auto;

            #btnSubmit {
                background-color: var(--color5);
                color: var(--color-white);
                padding: 5px 50px 9px 26px !important;
                display: block;
                width: fit-content;

                border-radius: 30px;
                border: 1px solid var(--color4);
                white-space: nowrap;
                line-height: 1.5;
                transition: all .3s;
                accent-color: var(--color4);
                background-image: url(../pictures/arrow_orange.svg);
                background-repeat: no-repeat;
                background-position: center right 20px;
                height: auto;
                font-size: 16px !important;


                &:hover {
                    background-color: var(--color5);
                    color: var(--color-white);
                    background-position: center right 16px;
                }
            }


        }

        .mandatory_info {
            font-size: 14px !important;
        }

        textarea {
            font-size: 1.2rem !important;
            line-height: 1.5 !important;
            border: 0 !important;
            font-family: "univia-pro", sans-serif !important;
            font-weight: 400 !important;
            font-style: normal !important;
            background-color: var(--color-greyinput) !important;
            border-radius: 26px !important;
            padding: 7px 50px 11px 30px !important;
            height: 20vh !important;
            color: var(--color-greytext2);
            text-transform: capitalize;


            &:focus {
                box-shadow: none !important;
            }

            &:-webkit-autofill:focus {
                background-color: #edf4f5 !important;
            }
        }


        /*div:has(> input[type="checkbox"]),  div:has(> input[type="radio"]) {*/
        /*    display: flex !important;*/
        /*}*/

        [type=checkbox], [type=radio] {
            margin-right: 8px !important;
            box-sizing: border-box !important;
            padding: 0 !important;
            width: 15px;
            accent-color: var(--color-black);
            margin-top: 6px !important;
        }
    }

}

div {

    .clear {
        display: none;
    }

    .form_field_label {
        height: auto !important;
    }
}





/*************** RESPONSIVE *******************/
@media (max-width: 1920px)  {
    .container-fluid {
        .row {
            padding: 0;
            .col-form {
                padding: 0 2vw;
                .logo {
                    width: 50% ;
                    padding: 1.5rem 2.5rem;
                }

                .title {
                    margin: 14vh 0 40px 0;
                    font-size: 2rem;
                }

                p {
                    font-size: 15px !important;
                }
            }


        }

        .clickdform {

            select {
                padding: 11px 50px 11px 30px;
            }

             [type="text"], [type="email"] {
                height: 47px;
            }

            input:not([type="hidden"]), select {
                margin-bottom: 5px;
            }

            div:has(> select) {
                &::after {
                    height: 4vh;
                    line-height: 2.8;
                }
            }

            .buttonContainer {
                #btnSubmit {
                    font-size: 15px !important;
                }
            }


        }
    }


}

@media (max-width: 1110px)  {
    .container-fluid {
        .row {
            .col-form {
                .logo {
                    width: calc(100% - 50vw);
                    display: flex;
                    justify-content: start !important;
                }

            }
        }

        .clickdform {

            div:has(> select) {
                &::after {
                    height: calc(100% - 1vh);
                }
            }
                /*}*/
        }
    }
}

@media (max-width: 992px)  {
    .buttonContainer {
        display: flex !important;
        justify-content: center !important;
        margin-right: 0 !important;
    }

}


@media (max-width: 767px)  {
    .container-fluid {
        width: 100% !important;
        .row {
            .col-picture {
                width: 0;
                display: none;
            }
            .col-form {
                width: 100% !important;
                padding: 0 4vw;

                .title {
                    padding: 0 10px;
                }

                .logo {
                    width: 100%;
                    justify-content: center !important;

                    img {
                        height: 4vh;
                    }
                }

            }

            .clickdform {
                padding: 0 !important;

                .minSize1 {
                    width: 100% !important;
                }

                [type="text"], [type="email"], textarea {
                    font-size: 1rem !important;
                }
            }
        }
    }


    .responsiveCellSize1 {
        width: 100% !important;
    }

    /*.buttonContainer {*/
    /*    display: flex !important;*/
    /*    justify-content: center !important;*/
    /*    margin-right: 0 !important;*/
    /*}*/


}


@media (max-width: 440px)  {
    .container-fluid {
        .row {
            .col-form {
                .title {
                    padding: 0 10px;
                    font-size: 1.6rem;

                    & + p {
                        padding: 0 10px;
                    }
                }
            }
        }
    }

    div:has(> select) {
        &::after {
            height: 4vh !important;
        }
    }


}

@media (max-width: 376px)  {

    div:has(> select) {
        &::after {
            height: 5vh !important;
        }
    }


}


/*@media (min-width: 768px)  {*/

/*    .container-fluid {*/
/*        .row {*/
/*            .col-form {*/
/*                padding: 0 32px;*/

/*                .logo {*/
/*                    width: calc(100% - 50vw);*/
/*                    padding: 13px 30px;*/
/*                    display: flex;*/
/*                    justify-content: center;*/

/*                    img {*/
/*                        width: calc(100% - 4vw);*/
/*                        height: 11vh;*/
/*                    }*/
/*                }*/

/*            }*/

/*        }*/
/*    }*/

/*}*/