:root {
    --color_primary: #bc8d2e;
    --color_secondary: #111111;
    --color_white: #fff;
    --color_black: #000;
    --color_slate: #1c1c1c;
}

.site_button {
    width: 270px;
    font-size: 22px;
    font-weight: 400 !important;
    text-transform: capitalize;
    color: var(--color_white);
    background: var(--color_primary);
    border: 2px solid var(--color_primary);
    position: relative;
    overflow: hidden;
    display: inline-block;
    text-align: center;
    line-height: 2;
    cursor: pointer;
    transition: all 0.5s ease-in-out 0s;
    transform: skew( -30deg, 0deg);
}

.site_button:hover {
    color: var(--color_white);
    background: url('../../../../uploads/2021/03/button_img_ptn.png') var(--color_secondary);
    border: 2px solid var(--color_secondary);
    transition: all 0.5s ease-in-out 0s;
    transform: skew( 30deg, 0deg);
}

.site_button div {
    transition: all 0.5s ease-in-out 0s;
    transform: skew( 30deg, 0deg);
}

.site_button:hover div {
    transition: all 0.5s ease-in-out 0s;
    transform: skew( -30deg, 0deg);
}

.site_button span {
    position: relative;
    z-index: 2;
    transition: all 0.5s ease-in-out 0s;
}


/* form Css code */

.pp_contact_form {
    float: left;
    width: 100%;
}

.pp_contact_form .form_input {
    float: left;
    padding: 10px;
    width: 50%;
}

.pp_contact_form .form_input.fl07,
.pp_contact_form .form_button {
    width: 100%;
    float: left;
    text-align: center;
}

.pp_contact_form .form_input.form_button {}

.pp_contact_form .form_input ::placeholder {
    color: #999999;
}

.pp_contact_form .form_input input,
.pp_contact_form .form_input textarea {
    font-size: 18px;
    width: 100%;
    color: var(--color_black);
    background: var(--color_white);
    line-height: 1.4;
    padding: 15px;
    border-color: #dddddd;
}

.pp_contact_form .form_input textarea {
    resize: none;
    height: 150px;
}

.pp_contact_form .ajax-loader {
    position: absolute;
    vertical-align: middle;
    transform: translate(0px, 13px);
}

.wpcf7-not-valid-tip {
    color: var(--color_black);
    text-align: left;
    font-size: 14px;
    font-weight: 500;
}

.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
    border-color: var(--color_color_primarywhite);
    color: var(--color_black);
    font-size: 14px !important;
    margin: 10px 0 0 0;
    float: left;
    width: 100%;
    padding: 5px;
    text-align: center;
    line-height: 1.5;
}


/* Popup box */


/*
#et-boc .area-outer-wrap[data-da-type=popup] {
    text-align: center !important;
    display: flex !important;
}


#site_popip_form .et_pb_row {
    padding: 0 !important;
} */

#et-boc .area-outer-wrap[data-da-type=popup] {
    max-width: 600px;
}

#site_fprm_popup {
    max-width: 600px;
}

#site_fprm_popup {
    max-width: 600px !important;
    background-size: 100% !important;
    padding: 0 !important;
}

#site_fprm_popup .et_pb_row {
    padding: 30px 30px !important;
    background: rgb(255 255 255 / 30%) !important;
}

#site_fprm_popup .et_pb_column {
    width: 100% !important;
}

#et-boc .area-outer-wrap[data-da-color=light] .da-close {
    color: #fff !important;
    background: hsl(312deg 3% 29%) !important;
    box-shadow: none !important;
    /* top: 7px !important;
    right: 7px !important; 
    opacity: 1 !important; */
}

@media all and (min-width: 320px) and (max-width: 767px) {
    .site_button {
        width: 160px;
        font-size: 14px;
        line-height: 2;
    }
    .pp_contact_form .form_input {
        padding: 5px;
        width: 100%;
    }
    .pp_contact_form .form_input input,
    .pp_contact_form .form_input textarea {
        font-size: 14px;
        padding: 10px;
    }
    .pp_contact_form .form_input textarea {
        height: 90px;
    }
}

@media all and (min-width: 481px) and (max-width: 767px) {
    .pp_contact_form .form_input {
        width: 50%;
    }
}

@media all and (min-width: 600px) and (max-width: 767px) {}

@media all and (min-width: 768px) and (max-width: 980px) {
    .site_button {
        width: 170px;
        font-size: 15px;
        line-height: 2;
    }
    .pp_contact_form .form_input input,
    .pp_contact_form .form_input textarea {
        font-size: 16px;
        padding: 10px;
    }
}

@media only screen and (min-width: 981px) and (max-width: 1024px) {
    .site_button {
        width: 210px;
        font-size: 16px;
    }
    .pp_contact_form .form_input input,
    .pp_contact_form .form_input textarea {
        font-size: 16px;
        padding: 10px;
    }
}

@media all and (min-width: 1025px) and (max-width: 1140px) {
    .site_button {
        width: 210px;
        font-size: 16px;
    }
}

@media all and (min-width: 1141px) and (max-width: 1280px) {
    .site_button {
        width: 210px;
        font-size: 18px;
    }
}

@media all and (min-width: 1281px) and (max-width: 1440px) {
    .site_button {
        width: 230px;
        font-size: 18px;
    }
}

@media all and (min-width: 1441px) and (max-width: 1680px) {}

@media all and (min-width: 1681px) and (max-width: 1880px) {}

@media all and (min-width: 981px) and (max-width: 3000px) {}

@media all and (min-width: 981px) and (max-width: 3000px) {}