/*@font-face {
    font-family: 'La Petite';
    src: local('La Petite'), url('../font/lapetite-pk36p.woff') format('woff');
}*/

body {
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f1eae4;
   /* font-family: 'La Petite', sans-serif;*/
}


.container {
    padding: 20px;
    /*min-height: 458px !important;*/ /* Set specific height for the container */
    /*max-height: 500px !important;*/
}

.shift-right {
    margin-left: 1rem;
}

.lheading {
    margin-bottom: 20px;
    margin-top: 30px;
}
    .lheading .spanheading {
    display:flex;    
    }

/* Underlined textarea style */
.underlined {
    border: none;
    border-bottom: 1px solid #182424;
    outline: none;
    resize: vertical; /* Allow vertical resizing */
    background: none;
}

h1.text-center {
    padding: 35px 0 35px 0; /* Adjust the value as needed */
}

.rating-container {
    display: flex;
    gap: 10px;
}

.rating-option {
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid black;
    cursor: pointer;
}

    .rating-option:hover {
        background-color: #182424; /* Slight shade when hovered for better UX */
        color: white; /* Text color set to white for better contrast */
    }

    .rating-option.selected {
        background-color: #182424; /* Blue background for selected option */
        color: white; /* Text color set to white for better contrast */
    }

#btnsavedata {
    border: none; /* Removes the border */
    background-color: #182424; /* Sets background color to blue */
    color: white; /* Sets text color to white for contrast */
    padding: 10px 20px; /* Adds padding for a better appearance */
    cursor: pointer; /* Changes the cursor to a hand on hover */
    border-radius: 0px; /* Rounds the corners slightly */
    transition: background-color 0.3s ease; /* Transition effect for hover */
}

    #btnsavedata:hover {
        background-color: #182424; /* Darkens the button when hovered over */
        color: white;
    }

    #btnsavedata:focus {
        box-shadow: none;
    }

/* Override Bootstrap's custom radio button color */
.custom-control-input:checked ~ .custom-control-label::before {
    border-color: black; /* Change this to your desired border color */
}

.custom-control-input:checked ~ .custom-control-label::after {
    background-color: black; /* Change this to your desired fill color */
}

select.form-control {
    height: auto !important;
    padding: 0.2rem 0.2rem calc(0.2rem + 1px) 0.2rem !important;
    background-color: #f1eae4;
    /*width: 292px; *//* or whatever width you prefer */
}

    select.form-control:focus {
        height: auto !important;
        padding: 0.2rem 0.2rem calc(0.2rem + 1px) 0.2rem !important;
        background-color: #f1eae4;
        border-color: #182424;
        box-shadow: none;
    }

#feedbackTextarea {
    background-color: #f1eae4;
    border-color: #182424;
    box-shadow: none;
}

.red {
    color: red;
}

.snnumber {
    font-weight: bold;
    margin-right: 15px;
    float:left;
}

.controldiv {
margin-left:3rem !important;
}
.form-check-label {
    display: inline;
}

.form-check{
    margin-bottom:0.5rem !important;
}
/* Custom CSS to style the label as a clickable element */
.form-check-label {
    cursor: pointer;
}


@media only screen and (max-width: 600px) {

    .controldiv {
        margin-left: 1.5rem !important;
    }
}



/*--thank you pop starts here--*/
.thank-you-pop {
    width: 100%;
    padding: 20px;
    text-align: center;
}

    .thank-you-pop img {
        width: 76px;
        height: auto;
        margin: 0 auto;
        display: block;
        margin-bottom: 25px;
    }

    .thank-you-pop h1 {
        font-size: 42px;
        margin-bottom: 25px;
        color: #5C5C5C;
    }

    .thank-you-pop p {
        font-size: 20px;
        margin-bottom: 27px;
        color: #5C5C5C;
    }

    .thank-you-pop h3.cupon-pop {
        font-size: 25px;
        margin-bottom: 40px;
        color: #222;
        display: inline-block;
        text-align: center;
        padding: 10px 20px;
        border: 2px dashed #222;
        clear: both;
        font-weight: normal;
    }

        .thank-you-pop h3.cupon-pop span {
            color: #03A9F4;
        }

    .thank-you-pop a {
        display: inline-block;
        margin: 0 auto;
        padding: 9px 20px;
        color: #fff;
        text-transform: uppercase;
        font-size: 14px;
        background-color: #8BC34A;
        border-radius: 17px;
    }

        .thank-you-pop a i {
            margin-right: 5px;
            color: #fff;
        }

#ignismyModal .modal-header {
    border: 0px;
}
/*--thank you pop ends here--*/