﻿header { background-color:#fff;padding:35px 10px;}
.general_text h2 {font-size:2.2em; font-weight:500;}
.general_form .form .form_title {font-size:1.5em; }

.insurances { width:100%;position:relative;margin-bottom:30px;}
    .insurances > ul { display: flex; flex-wrap: wrap; }
        .insurances > ul > li { width: 24%; margin-left: 1.33%; margin-bottom: 20px; }
            .insurances > ul > li:nth-child(4n) { margin-left: 0; }
            .insurances > ul > li > a { position: relative; display: block; padding-bottom: 110%; border-radius: 5px; }
                .insurances > ul > li > a::before { content: ""; position: absolute; right: 0; top: 0; width: 100%; height: 100%; background: transparent linear-gradient(180deg, #29244200 0%, #292442 100%) 0% 0% no-repeat padding-box; z-index: 2; pointer-events: none; }
                .insurances > ul > li > a::after { content: ""; position: absolute; right: 0; top: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; transition: all 0.25s ease-in-out; border: 3px solid #51B2FF; border-radius: 5px; border-bottom: none; opacity: 0; box-sizing: border-box; }
                .insurances > ul > li > a > div { position: absolute; bottom: 0; width: 100%; padding: 10px 10px 20px 10px; box-sizing: border-box; z-index: 2; }
                    .insurances > ul > li > a > div .title { display: block; text-align: center; margin-bottom: 20px; font-size: 1.5em; font-weight: 700; text-shadow: 0px 4px 5px #000000C4; color: #fff; transition: all 0.25s ease-in-out; }
                    .insurances > ul > li > a > div .like_button { display: block; border: 1px solid #FFFFFF; border-radius: 7px; padding: 13px 5px; text-align: center; font-size: 1.15em; font-weight: 500; width: 100%; max-width: 182px; margin: 0 auto; transition: all 0.25s ease-in-out; }
                .insurances > ul > li > a:hover .like_button, .insurances > ul > li > a.active .like_button { color: #51B2FF; border-color: #51B2FF; }
                .insurances > ul > li > a:hover .title, .insurances > ul > li > a.active .title { color: #51B2FF; }
                .insurances > ul > li > a:hover::after, .insurances > ul > li > a.active::after { opacity: 1; }

.process_line { width:100%;margin-bottom:60px;}
    .process_line > ul { display: flex; margin-bottom: 12px; width:100%;}
        .process_line > ul > li { width:33.33%;}
            .process_line > ul > li > a { display: block; color: #292442;font-size:1.15em;text-align:center;}
                .process_line > ul > li > a.active { color:#51B2FF;}
            .process_line > ul > li:first-child > a { text-align: right; }
        .process_line > ul > li:last-child > a {text-align:left; }

.process_line .line{ position: relative; width: 100%; height: 10px; border-radius: 5px; background-color: #292442; }
    .process_line .line > span { position: absolute; width: 10%; height: 100%; border-radius: 5px; background-color: #51B2FF; transition: all 1s ease-in-out; }


.steps_form_conti {position:absolute;width:100%;height:auto;top:0;right:0; z-index:5;border:none;padding:0;margin:0;display:none;}

.form_container { box-shadow: 0px 35px 80px #0000008F; border-radius: 5px; background-color: #292442; padding: 60px 10px; box-sizing: border-box; }
    .form_container .form .first { justify-content:space-between;display:flex;flex-wrap:wrap;}
        .form_container .form .first > li { width:24%;margin-bottom:20px;}
    .form_container .form .middle { margin-bottom: 65px; justify-content: space-between; display: flex; flex-wrap: wrap; }
    .form_container .form .middle > li {width:49%;}

    .form_container .form .last {margin-top:15px; }
    .form_container .form .last > li { width:100%;}
        .form_container .form .last > li .button {width:100%;max-width:182px;margin:0 auto; }
.thanks_image {text-align:center;margin-bottom:135px; display:flex;justify-content:center;align-items:center;flex-wrap:wrap;}
    .thanks_image > img { width: 100%; max-width: 135px; margin-bottom: 135px; }
.thanks_image > div {width:100%; font-size:1.15em;color:#51B2FF;}

@media only screen and (max-width : 1020px) {
    .process_line > ul > li > a {font-size:1.05em;text-align:center !important; }

    .insurances > ul {justify-content:space-between; }
    .insurances > ul > li {width:49%;margin: 0 0 20px 0; }

    .general_form {display:block;padding:0;border:none; }

    header > .flex > img:last-child { width:170px;}
}

@media only screen and (max-width : 500px) {
    .form_container .form .first > li, .form_container .form .middle > li { width: 100%; margin-bottom:15px;}
    .general_form .form {max-width:300px !important; }
}
