﻿.status_car_popup { font-family: Assistant, sans-serif; position: fixed; width: 100%; height: 100%; right: 0; top: 0; padding: 50px 10px 50px 10px; overflow: hidden; overflow-y: auto; background-color: rgb(0 0 0 / 0.72); z-index: 10000000; box-sizing: border-box; }
.close_status_car_popup { position: absolute; bottom: -30px; color: #CCCCCC; width: 100%; text-align: center; font-size: 1.3em; right: 0; }
.status_car_popup .conti { position: relative; width: 100%; max-width: 1289px; border-radius: 23px; background-color: #fff; margin: 0 auto; }
    .status_car_popup .conti .top_content { position: relative; padding: 30px 20px 28% 20px; background-image: url('/StatusCarPopups/bg.png'); background-repeat: no-repeat; background-position: center bottom; background-size: contain; }
        .status_car_popup .conti .top_content::after { content: ""; border-radius: 18px 18px 0 0; position: absolute; right: 10px; top: 10px; width: calc(100% - 20px); height: calc(100% - 10px); border: 1px dashed #00A3FE; border-bottom: none; pointer-events: none; }
        .status_car_popup .conti .top_content .popup_logo { display: block; width: 100%; max-width: 375px; margin: 0 auto 6px auto; }
        .status_car_popup .conti .top_content .title { display: block; text-align: center; font-size: 1.1em; color: #464646; }
            .status_car_popup .conti .top_content .title > * { font-weight: 500; }
        .status_car_popup .conti .top_content .bottom_img { width: 30%; max-width: 471px; position: absolute; bottom: -50px; left: 100px; }
    .status_car_popup .conti .bottom_content { padding: 70px 10px 20px 10px; box-sizing: border-box; box-shadow: 0px 0px 24px #00000029; }
        .status_car_popup .conti .bottom_content .content_conti { width: 100%; max-width: 918px; margin: 0 auto; }
    .status_car_popup .conti .form_title { display: block; margin-bottom: 16px; font-size: 1.1em; color: #757575; line-height: 120%; }
        .status_car_popup .conti .form_title > * { font-weight: 500; }
    .status_car_popup .conti form { position: relative; }
        .status_car_popup .conti form input { display: block; border: 1px solid #000000; border-radius: 13px; font-size: 1.3em; color: #727272; padding: 19px 27px 19px 224px; box-sizing: border-box; }
        .status_car_popup .conti form button { cursor: pointer; display: block; position: absolute; left: 0; top: 0; width: 100%; max-width: 214px; border-radius: 13px; color: #fff; background-color: #FE0077; font-size: 1.5em; font-weight: 400; text-align: center; height: 100%; line-height: 1; border: none; }
            .status_car_popup .conti form button:hover, .status_car_popup .conti form button:focus { background-color: #790039; }

    .status_car_popup .conti .note { display: block; border-radius: 18px; background-color: #00A3FE; padding: 20px 10px; box-sizing: border-box; }
        .status_car_popup .conti .note .note_conti { width: 100%; max-width: 918px; margin: 0 auto; display: flex; align-items: center; }
            .status_car_popup .conti .note .note_conti > img { width: 101px; }
            .status_car_popup .conti .note .note_conti > span { text-align: right; width: calc(100% - 101px); padding-right: 60px; box-sizing: border-box; position: relative; color: #fff; font-size: 1.2em; line-height: 120%; }
                .status_car_popup .conti .note .note_conti > span::after { content: ""; position: absolute; width: 2px; height: 100%; right: 30px; top: 0; background-color: #fff; }

.status_car_report { padding: 50px 10px 150px 10px; box-sizing: border-box; font-family: Assistant, sans-serif; background-image: url('/StatusCarPopups/carInner.svg'), url('/StatusCarPopups/bgInner.svg'); background-position: left bottom, center bottom; background-repeat: no-repeat,no-repeat; background-size:auto , contain; }
.status_car_report_2 { padding-bottom: 250px; }
    .status_car_report .conti { width: 100%; max-width: 1040px; padding: 0; box-sizing: border-box; margin: 0 auto; }
        .status_car_report .conti .top_content { }
            .status_car_report .conti .top_content .popup_logo { display: block; width: 100%; max-width: 375px; margin: 0 auto 6px auto; }
            .status_car_report .conti .top_content .title { font-size:2em;display:block;text-align:center;margin-bottom:20px;}
                .status_car_report .conti .top_content .title > * { font-weight:700;font-size:1em;color:#000;}
        .status_car_report .conti .bottom_content {  }
            .status_car_report .conti .bottom_content .content_conti { display: block; text-align: center; padding: 20px 200px; color: #fff; text-align: center; font-size: 1em; line-height: 120%; border-radius: 10px 10px 0 0; background-color: #0085CF; }
            .status_car_report .conti .bottom_content .content_conti > * { }
                .status_car_report .conti .bottom_content .content_conti .form_title { font-size:1.1em;}
                    .status_car_report .conti .bottom_content .content_conti .form_title > * { font-weight: 400; font-size: 1em; }
        .status_car_report .conti .note {position:relative;z-index:2; display: block; background-color: #00A3FE;border-radius:10px 10px 0 0;padding:10px 10px 20px 10px;box-sizing:border-box; margin-top:-10px;}
            .status_car_report .conti .note .note_conti { width: 100%; max-width: 918px; margin: 0 auto; display: flex; align-items: center; flex-wrap:wrap;}
                .status_car_report .conti .note .note_conti > img { width: 95px; margin-top:-50px;}
                .status_car_report .conti .note .note_conti > span { text-align: right; width: calc(100% - 95px); padding-right: 60px; box-sizing: border-box; position: relative; color: #fff; font-size: 1.2em; line-height: 120%; }
                    .status_car_report .conti .note .note_conti > span::after { content: ""; position: absolute; width: 2px; height: 100%; right: 30px; top: 0; background-color: #fff; }
    .status_car_report .report_form { display: block; background-color: #fff; border-radius: 23px; position: relative; z-index: 3; margin-top: -15px; padding: 30px; box-sizing: border-box; box-shadow: 0px 0px 15px #00000029; }
    .status_car_report .report_form.active {padding-bottom:80px; }
        .status_car_report .report_form::after { content: ""; border-radius: 18px ; position: absolute; right: 10px; top: 10px; width: calc(100% - 20px); height: calc(100% - 20px); border: 1px dashed #00A3FE; pointer-events: none; }
        .status_car_report .report_form form { }
            .status_car_report .report_form form  ul {display:flex; flex-wrap:wrap;justify-content:space-between;}
                .status_car_report .report_form form ul > li { width: 49%; margin-bottom: 10px; top: 0; right:0;padding:0;}
                     .status_car_report .report_form form > ul > li.checkbox_li {  width:100%;}
                    .status_car_report .report_form form  ul > li input:not([type="checkbox"]) { display: block; border: 1px solid #CCCCCC; padding: 13px 10px; box-sizing: border-box;border-radius: 13px; font-family: Assistant, sans-serif; width:100%;}
                .status_car_report .report_form form  ul > li input[type="file"] { padding:11px 10px;}
                    .status_car_report .report_form form  ul > li input[type="submit"] { cursor: pointer; display: block;  width: 100%;border-radius: 13px; color: #fff; background: #FE0077 !important; font-size: 1.5em; font-weight: 400; text-align: center; height: 100%; line-height: 1; border: none; }
                        .status_car_report .report_form form  ul > li input[type="submit"]:hover, .status_car_report .report_form form > ul > li input[type="submit"]:focus { background: #790039 !important; }
                    .status_car_report .report_form form  ul > li input[type="submit"].disabled {background:#CCCCCC !important; }

                .status_car_report .report_form form ul.checkboxs_items > li { width: 100%; }
                .status_car_report .report_form form ul.submit_button > li { width: 100%; }
                .status_car_report .report_form form ul.submit_button > li button {max-width:350px; }
.status_car_popup  .status_car_report .report_form form ul > li .button {max-width:100%;position:static;display:flex;align-items:center;flex-wrap:wrap; }

    .status_car_report .checbox_new_conti { position: relative; padding-right: 25px; box-sizing: border-box; padding-top: 2px; }
        .status_car_report .checbox_new_conti > div { position: absolute; right: 0; top: 0;width:18px;height:18px; }
        .status_car_report .checbox_new_conti > label { display: block; }
        .status_car_report .checbox_new_conti > div input {cursor:pointer; position: absolute; width: 100%; height: 100%; right: 0; top: 0; opacity: 0; }
        .status_car_report .checbox_new_conti > div span { position: absolute; width: 100%; height: 100%; right: 0; top: 0; border: 2px solid #00A3FE; pointer-events: none; border-radius:3px;box-sizing:border-box;}
            .status_car_report .checbox_new_conti > div span::after { content: ""; position: absolute; right: 1px; top: 1.5px; width: calc(100% - 2px); height: calc(100% - 3px); background-color: #00A3FE; opacity: 0; border-radius: 0; box-sizing: border-box; }
        .status_car_report .checbox_new_conti > div input:checked ~ span::after {opacity:1;}

    .status_car_report form ul > li {position:relative; }
        .status_car_report form ul > li .policy {top:100%;max-width:100%; right: 0 !important; width: 100%; text-align: center; }
        .status_car_report form ul > li .field-validation-error.checkbox_validation2 { bottom: 0; right: 0 !important; width: 100%; text-align: center; }

.floating_label { position: relative; }
    .floating_label label { position: absolute; background-color: #F9F9F9; width: calc(100% - 2px); height: calc(100% - 4px); right: 1px; top: 3px; display: flex; align-items: center; padding: 10px; box-sizing: border-box; color: #000;border-radius:13px; }
        .floating_label label:hover, .floating_label.active label, .floating_label input:hover ~ label { opacity: 0; pointer-events: none; }
    .floating_label input:focus ~ label { opacity: 0; pointer-events: none; }

#iframe_conti { margin-top: -80px;position:relative;z-index:3; }
    #iframe_conti iframe { width: 100%; min-height: 300px; }
    #iframe_conti .iframe_item { display: block; background-color: #fff; border-radius: 23px; position: relative; z-index: 3; margin-top: -15px; padding: 30px; box-sizing: border-box; box-shadow: 0px 0px 15px #00000029; }
    #iframe_conti .iframe_item .iframe_desc { text-align:center; font-size:1.4em; margin-bottom:10px; }
        #iframe_conti .iframe_item::after { content: ""; border-radius: 18px; position: absolute; right: 10px; top: 10px; width: calc(100% - 20px); height: calc(100% - 20px); border: 1px dashed #00A3FE; pointer-events: none; }
    #iframe_conti .title { position: relative; margin-bottom: 27px; text-align: center; }
        #iframe_conti .title::after { content: ""; position: absolute; right: 35px; top: 50%; transform: translateY(-50%); width: calc(100% - 70px); height: 2px; background-color: #00A3FE; z-index: 1; }
        #iframe_conti .title > span { color: #00A3FE;font-size:1.5em;font-weight:700; display:inline-block; padding: 0 20px; box-sizing: border-box; position: relative; z-index: 2; background-color:#fff;}

.bondage_status_car_popup .status_car_report {background-image:none !important;padding:20px 0 0 0; }
    .bondage_status_car_popup .status_car_report .report_form form > ul > li.padding_top_15 { padding-top: 0 !important; }
.bondage_status_car_popup.status_car_popup .conti .top_content { padding: 30px 20px 20% 20px; }


full_report_link { display: block; padding-top: 10px; box-sizing: border-box;  }
.full_report_link > img { display: block; width: 100%; border-radius: 10px; box-shadow: 0 3px 6px #1D8CE1;margin-bottom:30px; }
.full_report_link:hover > img, .full_report_link:focus > img { box-shadow: 0 3px 36px #1D8CE1; }

@media only screen and (max-width : 800px) {
    .status_car_report { background-size: 55%, contain;padding-bottom:100px; }
}

@media only screen and (max-width : 600px) {
    .status_car_report_2 { background-position: left bottom, center bottom;}
    .status_car_popup .conti .top_content .popup_logo, .status_car_report .conti .top_content .popup_logo { max-width: 191px; }
    .status_car_popup .conti .top_content { padding: 20px 20px 30% 20px; }
        .status_car_popup .conti .top_content .bottom_img { width: 45%; bottom: -20px; left: 20px; }
        .status_car_popup .conti .top_content .title { font-size: 0.8em; }
    .status_car_popup .conti .bottom_content { padding: 30px 10px 20px 10px; }
    .status_car_popup .conti form input { margin-bottom: 15px; padding: 13px 10px; }
    .status_car_popup .conti form button { position: static; max-width: 100%; height: auto; padding: 11px 10px; box-sizing: border-box; }
    .status_car_popup .conti .note .note_conti > img { width: 83px; }

    .status_car_popup .conti .form_title { font-size: 0.9em; }
    .status_car_popup .conti .note .note_conti > span { font-size: 0.9em; padding-right: 40px; }
        .status_car_popup .conti .note .note_conti > span::after { right: 20px; }

    .status_car_report .conti .bottom_content .content_conti {padding:20px 10px;box-sizing:border-box; }
    .status_car_report .conti .note .note_conti > img {margin:0;width:85px; }

    .status_car_report .conti .note .note_conti > span {width:calc(100% - 85px);padding-right:40px; font-size:1em;}
        .status_car_report .conti .note .note_conti > span::after {right:20px; }

    .status_car_report .report_form form > ul > li {width:100%; }
    .status_car_report .conti .top_content .title {font-size:1.4em; }


    #iframe_conti iframe {min-height:350px; }

}

/**/
