.alphabet button {
    border: none;
    padding: 3px;
    background: none;
}

.filterSearch input {
    padding: 5px;
    border: none;
    outline: none;
    border: 1px solid #fff;
}

.filterSearch input::placeholder {
    color: var(--black);
}

.filterSearch input:focus,
.filterSearch input:hover {
    border: 1px solid #ccc;
}

.filterSearch button {
    border: none;
    outline: none;
    background: none;
}

@media(min-width:992px) {
    .filterSearch input {
        width: 85%;
    }

    .filterSearch button {
        width: 15%;
    }
}

.filterContainer {
    position: relative;
    padding: 10px 0px;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

.filter,
.filterMainCategories {
    display: flex;
    flex-wrap: nowrap;
    /* align-items: center; */
}

@media(min-width:1600px) {
    .filter {
        align-items: center;
    }
}

.filterTab {
    flex: 1 1 auto;
    min-width: 110px;
    text-align: center;
    /* align-self: center; */
    padding-left: 10px;
    padding-right: 10px;
    font-weight: 600;
    border-right: 1px solid #ccc;
}

.filterTab:first-child {
    padding-left: 0px;
}

.filterTab:last-child {
    border-right: none;
}

.filterMainCategories .filterTab:last-child {
    border-right: 1px solid #ccc;
}

.filterTab i {
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    transition: all 0.2s ease-in-out;
}

.filterTab.active .bi-chevron-down {
    transform: rotate(180deg);
}

.filterTab.filterSearch i {
    margin-left: 0px;
}

.category,
.floor {
    cursor: pointer;
}

.alphabet span {
    padding-left: 10px;
}

.alphabet strong {
    font-weight: 600;
}

.alphabet strong,
.alphabet span {
    vertical-align: top;
}

.alphabet button {
    font-weight: normal;
    font-size: 12px;
    font-weight: 600;
    color: #7b7b7b;
    padding: 0px 3px;
}

.alphabet button:hover,
.alphabet button.active {
    color: var(--black);
    text-decoration: underline;
}

@media(max-width:991px) {

    .alphabet button:hover,
    .alphabet button.active {
        color: var(--white);
    }
}

.panel {
    background: #f8f8f8;
    padding: 10px 10px 0px;
    display: none;
    position: relative;
    width: 100%;
    border-bottom: 1px solid #ccc;
}

.panel label {
    margin-right: 20px;
    margin-bottom: 15px;
    margin-top: 5px;
    font-weight: 500;
}

.panel a {
    color: var(--black);
    display: inline-block;
    border-right: 1px solid #ccc;
    padding-right: 10px;
    margin-right: 10px;
    font-weight: 500;
    margin-bottom: 10px;
}

.panel a:hover {
    color: var(--gold);
}

.panel a:first-child {
    padding-left: 0px;
}

.panel input[type="checkbox"] {
    border: none;
    opacity: 0;
    width: 0px;
    height: 0px;
}

/* .panel input[type="checkbox"]:focus{
    box-shadow: none;
    border: none;
    outline: none;
    background-color: var(--darkGray);
} */
span.checkmark {
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    border-radius: 3px;
    border: 1px solid #ccc;
    position: relative;
    margin-right: 8px;
}

span.checkmark::after {
    position: absolute;
    content: '';
    display: none;
    left: 7px;
    top: 3px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.panel input:checked~.checkmark {
    background-color: #585858;
}

.panel input:checked~.checkmark::after {
    display: block;
}

/***************************************/

.logoNewBox {
    max-width: 300px;
    position: relative;
    padding: 15px;
    height: 100%;
    border: 1px solid #c5c4c4;
    transition: all 0.2s ease-in-out;
    /* margin: 20px 0px; */
    margin: 0 auto;
    cursor: pointer;
}

.logoNewBox.blogNewBox .logoImgContainer {
    height: 190px;
}

.logoNewBox.blogNewBox img {
    width: 100%;
    /* max-width: 100%;
    max-height: 100%; */

    height: 100%;
    margin: auto;
    object-fit: contain;
    object-position: center;
}

.logoNewBox div {
    z-index: 99;
    position: relative;
}

.logoNewBox::before,
.logoNewBox::after {
    content: '';
    position: absolute;
    width: 0%;
    height: 0%;
    display: block;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    border-top: 1px solid transparent;
    border-left: 1px solid transparent;
}

.logoNewBox::before {
    top: 0;
    left: 0;
}

.logoNewBox::after {
    bottom: 0px;
    right: 0px;
}

.logoNewBox:hover::before {
    width: 100%;
    height: 100%;
    border-top: 1px solid #878787;
    border-left: 1px solid #878787;
}

.logoNewBox:hover::after {
    width: 100%;
    height: 100%;
    border-bottom: 1px solid #878787;
    border-right: 1px solid #878787;
}

.logoNewBox:hover {
    transform: translateY(-3px);
    box-shadow: 0px 0px 12px #ccc;
}



.logoImgContainer {
    height: 85px;
    display: flex;
    margin-bottom: 15px;
}

.logoNewBox img {
    width: 100%;
    height: 100%;
    /* max-width: 80%;
    max-height: 80px; */
    margin: auto;
    object-fit: contain;
    object-position: center;
}




.logoNewBox .DineImgContainer img {
    width: 100%;
    height: 100%;
    margin: auto;
    object-fit: contain;
    object-position: center;
    /* object-fit: cover;     */
    /* max-width: 100%;
    max-height: inherit; */
}

.logoNewBox .DineImgContainer {
    margin-bottom: 15px;
    height: 200px;
}

@media (max-width: 1199.98px) {
    .logoNewBox .DineImgContainer {
        height: 162px;
    }
}



.dashedBorder {
    border-bottom: 1px dashed var(--darkGray);
}

.logoNewBox .dashedBorder {
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.logoNewBox .dashedBorder a {
    color: var(--black);
    font-weight: 500;
}

.logoNewBox .dashedBorder a,
.logoNewBox .dashedBorder span {
    margin: 0px 3px;
}

.logoNewBox .dashedBorder a:hover {
    color: var(--gold);
}

.entertainmentBox .dashedBorder a:hover {
    color: var(--black);
}

.logoNewBox .dashedBorder i {
    display: inline-block;
    width: 15px;
    vertical-align: middle;
    color: var(--gold);
}

.logoNewBox .dashedBorder:last-child {
    border-bottom: none;
    margin-bottom: 0px;
}

.logoTitle,
.dineTitle {
    font-weight: bold;
    font-size: 1.2rem;
    margin-bottom: 10px;
}

.dineTitle span {
    display: block;
}

.dineTitle a {
    font-size: 13px;
    display: inline-block;
}

.dineTitleList span {
    display: inline-block;
    font-weight: normal;
}

.textContent {
    display: inline-block;
    font-weight: 500;
}

.clearFilter {
    background: var(--darkGray);
    padding: 5px 10px;
    color: var(--white);
    border: none;
    transition: all 0.2s ease-in-out;
}

.clearFilter:hover {
    background: var(--black);
}


.applyFilterNew {
    background: var(--gold);
    padding: 5px 10px;
    color: var(--black);
    border: none;
    transition: all 0.2s ease-in-out;
}

.applyFilterNew:hover {
    background: var(--black);
    color: var(--gold);
}

@media screen and (max-width:991px) {
    .applyFilterNew {
        display: none;
    }
}

.filterBtn {
    position: fixed;
    right: 10px;
    bottom: 10px;
    background: var(--black);
    color: var(--white);
    width: 35px;
    height: 35px;
    line-height: 30px;
    text-align: center;
    border-radius: 50%;
    z-index: 99;
    border: 1px solid var(--white);
    display: none;
}

.filterBtnContainers {
    display: none;
}

/* .flowerBg{
    background: url(../images/leaves/flower.jpg) no-repeat right top;
    background-size: 300px auto;
} */
.flowerBg {
    background: url(https://phoenixcitadel.s3.ap-south-1.amazonaws.com/images/gift_card/flowerbg-1.png) top left no-repeat, url(https://phoenixcitadel.s3.ap-south-1.amazonaws.com/images/leaves/flower.jpg) 150% -20% no-repeat;
    background-size: 950px;
    background-color: white;
}

.pageTabs {
    text-align: center;
}

.pageTabs a,
.pageTabs span {
    display: inline-block;
    vertical-align: middle;
    padding: 0px 10px;
    font-family: var(--playfair);
    font-size: 1.8rem;
    color: var(--darkGray);
    font-weight: 500;
}

.pageTabs a.active {
    color: var(--gold);
}

.amenitiesIcon {
    text-align: center;
}

.amenitiesIcon img {
    width: auto;
    height: 65px;
    display: block;
    margin: 0px auto 20px;
}

.amenitiArrows {
    display: none;
}

/************** service page ***************/
.serviceMobHeading {
    display: none;
}

.serviceTabContainer ul.mainTabs {
    display: block;
    text-align: center;
}

.serviceTabContainer ul.mainTabs li {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    padding: 0px 15px;
    cursor: pointer;
    font-family: var(--playfair);
    border-right: 1px solid var(--darkGray);
    font-weight: 500;
    font-size: 1.5rem;
}

.serviceTabContainer ul.mainTabs li::after {
    content: '';
    display: block;
    width: 20px;
    height: 1px;
    background: var(--darkGray);
    margin-top: 7px;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.serviceTabContainer ul.mainTabs li:hover,
.serviceTabContainer ul.mainTabs li.active {
    color: var(--gold);
}

.serviceTabContainer ul.mainTabs li.active::after {
    background: var(--gold);
    width: 100%;
}

.serviceTabContainer ul.mainTabs li:hover::after {
    width: 100%;
}

.serviceTabContainer ul.mainTabs li:last-child {
    border-right: none;
}

.serviceTab .tab {
    display: none;
}


/*** map  expand css ***/
.serviceTab:first-child .tab {
    display: block;
}

/*** map  expand css ***/


.serviceMatter p,
.threeEasySteps p {
    font-size: 16px;
}

.dashBorderContainer {
    border-bottom: 1px dashed var(--borderColor);
    padding-bottom: 15px;
    margin-bottom: 20px;
}

.dashBorderContainer p:last-child {
    margin-bottom: 0px;
}

.steps {
    text-align: center;
    border-right: 1px dashed var(--borderColor);
    margin-bottom: 2.5rem;
}

.steps:last-child {
    border-right: none;
}

.steps span.number {
    display: block;
    font-family: var(--playfair);
    color: var(--gold);
    font-size: 2.5rem;
    margin-bottom: 1.2rem;
}

.steps h4 {
    font-family: var(--playfair);
    margin-bottom: 1rem;
}

.threeEasySteps {
    border-bottom: 1px solid var(--borderColor);
    margin-bottom: 2rem;
}

/********************************************/

.serviceBox {
    /* width: 250px; */
    text-align: center;
    /* margin-bottom: 20px; */
    padding-top: 20px;
    padding-bottom: 10px;
    border-right: 1px dashed var(--borderColor);
    border-bottom: 1px dashed var(--borderColor);
}

.serviceBox img {
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.serviceBox:hover img {
    transform: scale(1.1);
}

.differentServices .serviceBox {
    border-bottom: none;
}

.serviceBox:nth-child(13) {
    border-bottom: none;
}

.serviceBox:last-child {
    border-right: none;
    border-bottom: none;
}

.mallServiceIcons p {
    font-weight: 600;
}

.mallServiceIcons {
    padding-bottom: 30px;
}

.serviceBottomBorder {
    border-bottom: 1px dashed var(--borderColor);
}

/************Gift card page***********************/

.heading-light {
    color: var(--gray);
    font-weight: 300;
}

.gift-card .card-img {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0px 20px;
    height: 100%;
}

.gift-card .card-img img {
    width: inherit;
}

.zoom-effect .option {
    position: absolute;
    left: 0;
    bottom: 0;
    padding: 10px 25px;
    background-color: var(--white);
}

.zoom-effect .option a {
    color: var(--darkGrey);
}

.giftcard-benefits h4 {
    font-family: var(--playfair);
}

.giftcard-video {
    position: relative;
}

.giftcard-video video {
    cursor: pointer;
    width: 100%;
}

.giftcard-video button {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: transparent;
    outline: none;
    border: none;
}

.giftcard-video .play-btn-wrapper {
    border-radius: 50%;
    margin: 0 auto;
    width: fit-content;
    background-color: #fff5;
    animation: blink 0.5s infinite;
    transition: all ease 0.3s;
}

.giftcard-video .controls img {
    width: 80px;
}

.controls .play-btn-wrapper:hover,
.controls .play-btn-wrapper:focus {
    animation: none;
}

@keyframes blink {
    0% {
        padding: 0px;
    }

    100% {
        padding: 15px;
    }
}

/*********Careers page********/
.career-life-benefits {
    column-count: 2;
    column-gap: 50px;
    -moz-column-count: 50px;
}

.career-benefits {
    display: block;
    position: relative;
}

.career-benefits img {
    width: 100%;
}

.career-benefits .text-container {
    position: absolute;
    bottom: -15%;
    right: 0;
    width: 75%;
    background-color: var(--white);
    padding: 20px 0px;
    padding-left: 30px;
}

.career-life-benefits .career-benefits:not(:first-child) {
    padding-top: 15%;
    margin-top: 10%;
}

.career-btm-heading {
    max-width: 500px;
}

.career-btm-heading::after {
    display: none !important;
}

/*****Form *****************/
/*****Remove number control arrows**/
/* Chrome, Safari, Edge, Opera */
.custom-form input::-webkit-outer-spin-button,
.custom-form input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
.custom-form input[type=number] {
    -moz-appearance: textfield;
}

.custom-form {
    padding: 30px 45px;
    border: solid 2px #E1C562;
}

.custom-form input {
    width: 100%;
    border: none;
    border-bottom: solid 1px #C5C4C4;
    padding: 16px 0px;
    margin-bottom: 3px;
}

.custom-form input:focus {
    outline: none;
}

.custom-form button {
    background-color: transparent;
    border: none;
}

.corporate-enquiry h3 {
    line-height: 3.6rem;
}

.corporate-enquiry h3::after {
    display: none;
}

/********** blogDetailsContent  ***************/

.blogDetailsContent .date i,
.blogDetailsContent .zone i {
    color: var(--gold);
    margin-right: 5px;
}

.blogDetailsContent p:last-child {
    margin-bottom: 0px;
}

.rightBorder {
    border-right: 1px dashed var(--borderColor);
}

.contactForm input[type="text"],
.contactForm input[type="text"]:focus {
    width: 100%;
    border: none;
    outline: none;
    border-bottom: 1px solid var(--borderColor);
}

.contactForm input[type="submit"] {
    background: var(--gold);
    color: var(--black);
    padding: 8px 20px;
    font-weight: 600;
    border: none;
}

.contactForm input[type="submit"]:hover {
    background: var(--black);
    color: var(--white);
}

.contactMap iframe {
    width: 100%;
    height: 350px;
}

@media(min-width:992px) {

    .serviceBox:nth-child(4),
    .serviceBox:nth-child(8),
    .serviceBox:nth-child(12) {
        border-right: none;
    }
}

.serviceBox img {
    height: 50px;
    display: block;
    margin: 0 auto 15px;
}

@media(min-width:768px) and (max-width:991px) {

    .serviceBox:nth-child(3),
    .serviceBox:nth-child(6),
    .serviceBox:nth-child(9),
    .serviceBox:nth-child(12) {
        border-right: none;
    }
}

@media(max-width:991px) {
    .flowerBg {
        background: url(https://phoenixcitadel.s3.ap-south-1.amazonaws.com/images/gift_card/flowerbg-1.png) top right no-repeat;
        background-size: 550px;
    }

    .rightBorder {
        border-right: none;
    }

    .filterMainCategories {
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
        order: 3;
    }

    .filterMainCategories .filterTab {
        width: 33%;
    }

    .filterMainCategories .filterTab:last-child {
        border-right: none;
    }

    .filterBtnContainers {
        display: flex;
        padding: 15px;
        justify-content: space-between;
    }

    .applyfilter {
        background: var(--white);
        color: var(--black);
        padding: 4px 5px;
        border: none;
        font-weight: 500;

    }

    .filterClose {
        display: block;
        /* margin: 0 auto; */
        background: none;
        border: none;
        color: var(--gold);
        font-size: 1.8rem;
        padding: 0px;
    }

    .filterClose1 {
        display: inline-block;
        background: var(--gold);
        color: var(--black);
        padding: 5px 5px;        
        font-weight: 500;
        border-style: none;
    }


    .alphabet button {
        padding: 5px 10px;
    }

    .filterBtn {
        display: block;
    }

    .filterSec {
        position: fixed;
        z-index: 9999;
        background: var(--black);
        max-width: 400px;
        width: 100%;
        height: 100%;
        overflow: auto;
        top: 0px;
        right: -100%;
        -webkit-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
    }

    .filter {
        flex-wrap: wrap;
        justify-content: flex-start;
        flex-direction: row-reverse;
        padding: 10px 15px;
    }

    .filterTab {
        flex: 0 0 auto;
        width: 100%;
        text-align: left;
        padding: 0px;
        border: none;
        margin-bottom: 20px;
        color: var(--white);
    }

    /* .filterTab.category, .filterTab.floor{
        width: 50%;
        margin-bottom: 0px;
    } */

    .clearFilter {
        margin-bottom: 20px;
    }

    .alphabet button {
        color: var(--gold);
    }

    .filterSearch button {
        background: var(--gold);
        height: 32px;
        width: 32px;
    }

    .filterSearch input {
        width: 85%;
    }

    .filterTab.filterSearch {
        order: 1;
    }

    .filterTab.alphabet {
        order: 2;
    }

    /* .filterTab.category{
        order: 3;
    }
    .filterTab.floor{
        order: 4;
    } */

    .openPanel {
        right: 0px;
    }

    .giftcard-video .controls img {
        width: 50px;
    }

    .gift-card .card-img {
        padding: 0px;
    }

    .corporate-enquiry h3 {
        margin-top: 20px;
        line-height: 3rem;
    }

    .career-benefits .text-container {
        width: 85%;
        bottom: -30%;
        padding-left: 25px;
    }

    .career-life-benefits .career-benefits:not(:first-child) {
        margin-top: 25%;
    }
}

@media(max-width:767px) {
    .steps {
        margin-bottom: 1rem;
    }

    .serviceBox:nth-child(even) {
        border-right: none;
    }

    .serviceTabContainer ul.mainTabs {
        display: none;
    }

    .serviceMobHeading {
        font-size: 1.2rem;
        display: block;
        font-family: var(--playfair);
        width: 100%;
        padding: 10px 30px;
        text-align: left;
        border: solid 1px #C5C4C4;
        margin-bottom: 20px;
        color: var(--darkGrey);
        font-weight: 550;
    }

    .serviceMobHeading i {
        display: block;
        float: right;
        margin-left: 10px;
        transition: all 0.2s ease-in-out;
    }

    .serviceMobHeading.active i {
        transform: rotate(180deg);
    }

    .serviceMobHeading.active {
        background: var(--gold);
    }

    .career-life-benefits {
        column-count: 1;
    }
}

@media(max-width:575px) {
    .steps {
        border: none;
    }

    .career-benefits .text-container {
        width: 100%;
        bottom: inherit;
        padding-left: 15px;
        padding-right: 15px;
        position: relative;
        margin-bottom: 10px;
    }

    .career-life-benefits .career-benefits:not(:first-child) {
        margin-top: 0px;
        padding-top: 0px;
    }
}