.rqt-retroaction {
    padding-left: 16px;
}

.rqt-title-retroaction {
    margin-bottom: 16px;
}

.rqt-title-retroaction h2 {
    background-color: #095797;
    color: #fff;
    font-family: Roboto;
    font-size: 1.313rem;
    font-stretch: normal;
    font-style: normal;
    font-weight: 700;
    letter-spacing: normal;
    line-height: 1.14;
    margin-top: 24px;
    padding: 13px 15px 13.4px 22px;
    text-align: left;
}

.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
    display: none;
}

.rqt-button-retro.wpcf7-form-control {
    background-color: #095797;
    border: 2px solid #095797;;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 1rem;
    font-weight: 700;
    height: 56px;
    line-height: 1.5;
    padding: 17px 24px;
    text-align: center;
    width: 133px;
}

.rqt-button-retro:focus {
    background-color: #156bb2;
    border: 2px solid #223654;
}

.rqt-button-retro:hover {
    background-color: #156bb2;
}

.wpcf7-response-output {
    font-family: 'Open Sans',sans-serif;
    font-weight: 600;
    line-height: 1.38;
    max-width: 788px;
    margin-left: 0px !important;
}

.wpcf7-response-output:before {
    background-image: url(/wp-content/themes/divi-child-cct/icons/ico-confirmation.svg);
    content: "";
    display: inline-block;
    float: left;
    height: 30px;
    width: 33px;
}

.wpcf7 form.sent .wpcf7-response-output {
    border:0px;
}

.wpcf7-form-control-wrap .wpcf7-radio .wpcf7-not-valid .wpcf7-not-valid-tip {
    padding-left: 16px;
}

span[data-name="Formation_utile"] .wpcf7-not-valid-tip,
span[data-name="Probleme"] .wpcf7-not-valid-tip {
    padding-left: 16px;
}

@media only screen and (max-width: 979px) {
    .rqt-button-retro {
        margin-left: 0px;
        width: 370px;
    }
    
    .rqt-max-length,
    .rqt-button-retro,
    .rqt-title-retroaction h2 {
        max-width: 100%;
    }

    .rqt-title-form{
        margin-left: 0px;
    }

    span[data-name="Formation_utile"] .wpcf7-not-valid-tip,
    span[data-name="Probleme"] .wpcf7-not-valid-tip {
        padding-left: 0px;   
    }
    .rqt-retroaction {
        padding-left: 0px;
    }
}

.rqt-retroaction-rate.wpcf7-form-control.wpcf7-radio.rqt-cf7-radio-compact,
.rqt-retroaction-rate.wpcf7-form-control.wpcf7-radio.rqt-cf7-radio-default {
    display: inline-block;
    height: 46px;
}

.rqt-retroaction-rate.wpcf7-form-control.wpcf7-radio.rqt-cf7-radio-compact {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: nowrap;
    justify-content: flex-end;
}

.rqt-retroaction-rate:not(:checked) > input {
    position:fixed;
    top:-9999px;
}

.rqt-retroaction-rate:not(:checked) > label {
    align-items: center;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    float: right;
    font-size: 0;
    height: 46px;
    justify-content: center;
    margin-right: 16px;
    overflow: hidden;
    padding: 0px;
    white-space: nowrap;
    width: 46px;
}

.rqt-retroaction-rate:not(:checked) > label:before {
    box-sizing: border-box;
    content: '★';
    display: block;
    font-size: 2.25rem;
    height: 36px;
    line-height: 36px;
    text-align: center;
    width: 36px;
    -webkit-text-stroke: 2px #095797;
}

.rqt-retroaction-rate > input:checked ~ label,
.rqt-retroaction-rate:not(:checked) > label:hover,
.rqt-retroaction-rate:not(:checked) > label:hover ~ label {
    color: #095797;    
}

.rqt-retroaction-rate > input:checked + label:hover,
.rqt-retroaction-rate > input:checked + label:hover ~ label,
.rqt-retroaction-rate > input:checked ~ label:hover,
.rqt-retroaction-rate > input:checked ~ label:hover ~ label,
.rqt-retroaction-rate > label:hover ~ input:checked ~ label {
    color: #156bb2;
}

@media only screen and (max-width: 370px) {
    .rqt-retroaction-rate:not(:checked) > label {
        margin: 0;
    }  

    .rqt-retroaction-rate.wpcf7-form-control.wpcf7-radio.rqt-cf7-radio-compact {
        justify-content:space-between;
    }
}