style.css

@import url('https://fonts.googledapis.com/css2?family=Nunito:wght@500&family=Oswald:wght@500&family=Rubik:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Sans:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@100;200;300;400;500&family=Noto+Sans:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@800&family=Noto+Sans:wght@300&display=swap');
/* @import url('https://fonts.googleapis.com/css2?family=Kanit:wght@500&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Kanit&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kanit&family=Montserrat:wght@200&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@300&display=swap');

* {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --global-font-family: 'Kanit', sans-serif;
}


.right {
    margin-right: calc(11% + 24px);
    margin-top: 0px;
}

.HEADER_IMAGE {
    object-fit: cover;
    background-color: transparent;
}

.btnadds {


    width: 96px !important;
    height: 36px !important;
    z-index: 19999;
    color: #60b246;
    box-shadow: 0 3px 8px #e9e9eb;
    background-color: white;
    bottom: 10px;
    left: 11px;
    border-radius: 4px;
    font-size: 16px;
    margin: auto;
    position: absolute;
}

.btnaddsa {


    color: #7e808c;
    font-size: 10px;
    position: absolute;
    width: 100%;
    text-align: center;
    line-height: 1;
    font-weight: 500;

    pointer-events: none;
    font-family: 'Kanit', sans-serif;
    z-index: 19999;

    bottom: -3px;
    left: 1px;
    border-radius: 4px;

    margin: auto;
    position: absolute;
}


.svg {
    width: 48px;
    height: 48px;
}

.asiuhd {
    display: flex;
    border-bottom: 1px solid #e9e9eb;
    padding-bottom: 10px;
    align-items: center;
    height: 34%;
    margin-bottom: 8px;
    flex-direction: row;
}

.header {
    height: 80px;
    padding: 0px calc(11% + 11px);
    border-bottom: 1px solid rgb(226, 226, 231);
    display: flex;
    box-shadow: rgba(27, 30, 36, 0.06) 0px 8px 16px, rgba(27, 30, 36, 0.04) 0px 0px 8px;
    top: 0;
    background-color: white;
    z-index: 200000;
    position: sticky;
    justify-content: space-between;

}

.wrapper {
    position: relative;
    z-index: 10;
    height: 208px;
    border-radius: 15px;
}

.wrapper_size {
    height: 208px;
    width: 100%;
}

.wrapper_shimmer {
    animation-duration: 2.2s;

    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: shimmer;
    animation-timing-function: linear;
    background: #ddd;
    background: linear-gradient(to right, #F6F6F6 8%, #F0F0F0 18%, #F6F6F6 33%);
    background-size: 1200px 100%
}

.shuthefuckup {
    height: 16px;
    width: 100%;
    border-bottom: 16px solid #f1f1f6;
}

.image-res {
    z-index: 0;
    position: relative;
    object-fit: cover;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    width: 325px;

    height: 216px;
    border-radius: 15px;


}

.shadow {
    z-index: 12;
    position: relative;
    bottom: 81px;
    left: 0px;
    width: 100%;
    height: 81px;
    border-radius: 15px;
    background-color: black;
    background: linear-gradient(rgba(27, 30, 36, 0) 0%, rgb(27, 30, 36) 84.21%);
}

.offer {
    -webkit-font-smoothing: antialiased;
    font-family: 'Rubik', sans-serif;
    font-weight: 800;
    font-size: 22px;
    line-height: 22px;
    letter-spacing: -0.5px;
    position: absolute;
    top: 49px;
    left: 9px;
    color: rgba(255, 255, 255, 0.92);
    overflow: hidden;
    width: 100%;
    display: -webkit-box;
    overflow-wrap: break-word;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.logo {
    height: 100%;
    display: flex;

    justify-content: space-between;

    flex-direction: row;



}

.search_city {
    margin-top: 9px;
    width: 431px;
    display: flex;

    display: flex;
    padding-top: 12px;

    justify-content: start;
    flex-direction: column;
    height: fit-content;
    position: relative;

}

.namessssas {
    cursor: pointer;
    font-family: 'Kanit',
        sans-serif;
    border-bottom: 1px solid black;
    padding-top: 14px;
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: -0.3px;
    color: rgba(2, 6, 12, 0.75);
    margin-top: 10px;
}

.serchsug {
    display: none;
    top: 48px;
    z-index: 244;
    overflow: hidden;
    width: 100%;
    box-sizing: border-box;
    border-right: 1px solid #d4d5d9;
    border-left: 1px solid #d4d5d9;
    border-bottom: 1px solid #d4d5d9;
    box-sizing: border-box;
    padding-right: 20px;
    padding-left: 20px;
    padding-bottom: 20px;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    box-sizing: border-box;
    background-color: white;

}

.cityinput {

    padding: 12px;
    border: 1px solid #d4d5d9;
    width: 100%;

}

.cityinput:focus {
    box-shadow: 0 1px 7px 1px #d4d5d9
}

.time_del {
    font-weight: 200;
    font-family: 'Rubik', sans-serif;
    font-size: 16px;
    margin-left: 200px;
}

.sort {
    display: flex;
    padding: 20px;
    justify-content: end;
}

.buttons {
    gap: 10px;
    display: flex;
    flex-direction: row;
    margin-right: 22px;
}

.left_slide_btn {
    border-radius: 100%;
    padding: 8px 8px 4px;
    background: rgb(226, 226, 231);
    cursor: pointer;
}

.right_slide_btn {
    border-radius: 100%;
    cursor: pointer;
    padding: 8px 8px 4px;
    background: rgb(226, 226, 231);
}

.left_slide_btnw {
    border-radius: 100%;
    cursor: pointer;
    padding: 8px 8px 4px;
    background: rgb(226, 226, 231);
}

.right_slide_btnw {
    border-radius: 100%;
    cursor: pointer;
    padding: 8px 8px 4px;
    background: rgb(226, 226, 231);
}

.br {

    width: 90%;
    margin-left: auto;
    margin-bottom: 20px;
    margin-right: auto;
    height: 3px;
    border-radius: 2px;
    position: relative;
    background-color: rgb(240, 240, 245);
}

.a2 {
    color: #ed5e0e;
    font-size: .57rem;
    padding: 2px 0;
    height: 50%;
    font-family: 'Kanit',
        sans-serif;
}

.a1 {
    height: 50%;
    margin-top: -4px;
    color: #ed5e0e;
    font-size: .93rem;
    padding-top: 2px;
    font-family: 'Kanit',
        sans-serif;
}

.absssssdwwws {
    position: absolute;
    width: 72px;
    border-radius: 4px;
    height: 33px;
    top: 51px;
    left: 40px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);

    margin: auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    z-index: 1;
    background-color: #fff;
    border: 0.85px solid #e3e3e3;
    box-sizing: border-box;
    box-shadow: 0 0 8px rgba(40, 44, 63, .2);
}

.crousel {
    display: flex;
    align-items: start;
    flex-direction: column;
    margin-top: 27px;
    justify-content: center;
    gap: 23px;
}

.crouselx {
    display: flex;
    align-items: start;
    flex-direction: column;
    padding-left: 16px;
    justify-content: center;
    gap: 23px;
}

.upper {
    display: flex;
    width: 95%;

    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.button {
    border-radius: 50%;
    height: 20px;
    width: 20px;
}

.cards {
    flex: 0 0 25%;
}

.perent_slider {
    width: 95%;
    height: 100%;
    flex-direction: row;

    overflow: hidden;

    column-gap: 12px;
    display: flex;
}

.slider {
    width: 100%;
    height: 100%;
    scroll-behavior: smooth;
    /* --slider-index: 0; */
    flex-direction: row;
    gap: 10px;

    /* transform: translateX(calc(var(--slider-index) * -10%)); */
    transition: all 2s ease-in-out;
    column-gap: 12px;
    display: flex;
    overflow-x: scroll;
}

.sliderw {
    width: 100%;
    height: 100%;
    scroll-behavior: smooth;
    /* --slider-index: 0; */
    flex-direction: row;
    gap: 10px;

    /* transform: translateX(calc(var(--slider-index) * -10%)); */
    transition: all 2s ease-in-out;
    column-gap: 12px;
    display: flex;
    overflow-x: scroll;
}

.slider::-webkit-scrollbar {
    display: none;
    /* Hide scrollbar in Webkit-based browsers */
}

.sliderw::-webkit-scrollbar {
    display: none;
    /* Hide scrollbar in Webkit-based browsers */
}

.container_main {

    height: 100%;
    margin-left: calc(10% + 36px);
    margin-right: calc(10% + 36px);
    padding: 0;
    gap: 23px;
    flex-direction: column;
    display: flex;

}

.container_main_shimmer {

    flex-direction: row;
    gap: 23px;
    margin-left: calc(10% + 36px);
    margin-right: calc(10% + 36px);
    padding: 0;
    margin-top: 50px;
    flex-wrap: wrap;
    display: flex;

}

.cr_title {
    font-size: 24px;
    font-weight: 800;
    line-height: 28px;
    letter-spacing: -0.4px;
    font-family: 'Rubik', sans-serif;
    color: rgba(2, 6, 12, 0.92);
}

.topres {
    font-size: 24px;
    font-weight: 800;
    line-height: 28px;
    letter-spacing: -0.4px;
    font-family: 'Rubik', sans-serif;
    color: rgba(2, 6, 12, 0.92);
}

.give_padding {
    /* display: flex;
    flex-direction: row;
    height: 100%;
    column-gap: 32px;
    width: 100%;
    flex-flow: row wrap;
    padding: 0px;
    flex-wrap: wrap;
    align-items: start;
    justify-content: center;
    gap: 45px; */

    flex-flow: wrap;
    justify-content: flex-start;
    align-items: start;
    gap: 45px;
    column-gap: 12px;
    width: 100%;
    height: 100%;
    padding: 0;
    display: flex;
}

.rating {
    margin: 10px 10px 10px 10px;
    display: flex;
}

.ulas {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 574px;
    margin-right: 79px;
    height: 100%;
    list-style-type: none;
    display: flex;
}


.itemss {

    /* -webkit-font-smoothing: antialiased;
    font-family: 'Rubik', sans-serif;
    font-size: 16px;
    font-weight: 200;
    line-height: 19px;

    letter-spacing: -0.3px;
    color: rgba(2, 6, 12, 0.6);
    margin: 2px 0 0px 12px;
    overflow: hidden;
    width: 100%;
    display: -webkit-box;
    overflow-wrap: break-word;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical; */

    -webkit-font-smoothing: antialiased;
    font-family: 'Rubik', sans-serif;
    font-size: 16px;
    margin: 2px 0 0px 12px;
    font-weight: 200;
    line-height: 19px;
    letter-spacing: -0.3px;
    color: rgba(2, 6, 12, 0.6);
    overflow: hidden;
    width: 97%;

    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;


}

.item {
    font-family: Arial, Helvetica, sans-serif
}

.container-card {
    max-width: 325px;
    width: max-content;
    height: max-content;
    display: flex;
    cursor: pointer;
    gap: 20px;
    justify-content: center;
    align-items: self-start;
    padding: 0;
    transition: all 0.1s ease-in-out;
    flex-direction: column;

}

.container-card:hover {
    scale: 0.95;
}

.container-card_shimmer {
    width: 312px;
    display: flex;
    cursor: pointer;
    gap: 12px;
    justify-content: center;
    align-items: self-start;
    padding: 0;
    flex-direction: column;
    height: 310px;
}

.content-line {
    height: 8px;
    width: 100%;
    margin-bottom: 16px;
    border-radius: 8px;
}



.name_of_hotel {
    font-size: 18px;
    margin: 0px 0 0px 12px;
    letter-spacing: -0.3px;
    font-weight: 500;
    color: rgba(2, 6, 12, 0.75);
    -webkit-font-smoothing: antialiased;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    font-family: var(--global-font-family)
}

.name_of_hotel_shimmer {
    height: 24px;
    width: 75%;
    margin-bottom: 12px;
    border-radius: 20px;

}

.navitems {
    align-items: center;
    justify-content: center;
    padding: 0;
    display: flex;
    justify-content: space-around;
}

.info_card {
    text-align: left;
    width: 100%;

}

.uppar_body {
    width: 100%;
    height: 300px;
    background: linear-gradient(0deg, rgb(201, 188, 244) 0%, rgb(255, 255, 255) 95.83%);
    border-bottom-left-radius: 1.5rem;
    border-bottom-right-radius: 1.5rem;
    outline: none;
    overflow: hidden;
}



.RES_MIDDLE_NAME {
    font-size: 48px;
    line-height: 48px;
    letter-spacing: -0.43px;
    font-family: 'Kanit', sans-serif;
    letter-spacing: 2px;
    -webkit-font-smoothing: antialiased;
    color: rgba(2, 6, 12, 0.75);

}

.arrow {
    width: 128px;
    height: 10px;
    margin-top: 0px;
}

.set {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    position: relative;
    height: 100%;

}

.left {
    margin-left: calc(11% + 11px);
    margin-top: 15px;


    height: 145px;
    max-width: 344PX;
}

.image {
    height: 100%;
}

.img_offer {
    width: 425px;
    cursor: pointer;
}

.left_slide_btn:hover {
    transform: scale(0.95);
}

.right_slide_btn:hover {
    transform: scale(0.95);
}

.offers_div {
    flex-direction: column;
    justify-content: center;
    align-items: start;
    gap: 23px;
    overflow: hidden;
    margin-top: 27px;
    display: flex;
}

.img_off_cont {
    cursor: pointer;
    width: 33.3333333333%;

}

.stars_text {
    margin-left: 7px;
    font-weight: 200;
    font-family: 'Rubik', sans-serif;
    font-size: 16px;
}

.offer_cont {
    display: flex;
    gap: 16px;
    flex-direction: row;
    width: 100%;
}

.asdasasdas {
    display: flex;
    align-items: center;
    width: 100%;
    flex-direction: column;
    justify-content: center;
}

.asuhdwoo {
    -webkit-font-smoothing: antialiased;
    font-family: 'Kanit', sans-serif;
    font-size: 16px;
    margin-top: 12px;
    font-weight: 200;
    line-height: 19px;
    letter-spacing: -0.3px;
    color: rgba(2, 6, 12, 0.6);
    text-align: center;
}

.asudhdsa {
    -webkit-font-smoothing: antialiased;
    font-family: 'Kanit', sans-serif;
    font-size: 20px;
    font-weight: 800;
    line-height: 24px;
    margin-top: 20px;
    letter-spacing: -0.3px;
    color: rgba(2, 6, 12, 0.92);
    text-align: center;
}

.cities_ke_div {
    padding: 16px;
    box-sizing: border-box;
    border: 1.5px solid rgba(2, 6, 12, 0.1);
    border-radius: 12px;
    width: 340px;
    font-family: 'Kanit', sans-serif;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 400;
    cursor: pointer;
    line-height: 19px;
    letter-spacing: -0.3px;
    font-size: 16px;
    color: rgba(2, 6, 12, 0.75);

}

.ashuhschdj {
    margin: 0px;
    -webkit-font-smoothing: antialiased;
    font-family: 'Kanit', sans-serif;
    font-size: 24px;
    margin-left: 25px;
    font-weight: 800;
    line-height: 28px;
    letter-spacing: -0.4px;
    color: rgba(2, 6, 12, 0.92);
}

.popx {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 25px;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;
}


.JODIHHDHS {
    margin-top: 60px;
    width: 384px;
}

.perent_div {

    justify-content: center;
    display: flex;
    align-items: start;
    /* height: calc(100vh-60px); */
    height: calc(100vh - 81px);
}

.perent_div_a {
    margin-top: 100px;
    padding-left: 600px;
    padding-right: 600px;
    justify-content: space-between;
    display: flex;
    align-items: start;
    /* height: calc(100vh-60px); */
    height: calc(100vh - 81px);
}

.child_cont {

    width: 800px;
    margin-top: 25px;
    max-width: 800px;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.top_bar_small {
    position: relative;
    width: 100%;
    display: flex;

    align-items: center;
    justify-content: space-between;
    height: 52px;
}

.center {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.results {
    margin-top: 25px;
}

.res_name_rh {
    height: 100%;
    width: 93%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 10px;
    color: #93959f;
    font-family: 'Kanit', sans-serif;

}

.search_rh {
    height: 100%;
    justify-content: end;
    width: 7%;
    font-family: 'Kanit', sans-serif;


}

.svg_mag {
    width: 40%;
}

.upperinfo_up {

    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    padding-top: 16px;
    margin-bottom: 18px;
    height: 83.0312px;
}

.naishdu {
    font-size: 1.43rem;
    font-weight: 600;
    color: #282c3f;
    margin-bottom: 8px;
    text-transform: capitalize;
    font-family: 'Kanit', sans-serif;
}

.sedfs {
    width: 20px;
}

.aihso {
    font-size: .93rem;
    color: #7e808c;
    height: calc(0.93rem + 8px);
    overflow: hidden;
    text-overflow: ellipsis;

    white-space: nowrap;
    font-family: 'Kanit', sans-serif;
}

.upper_info {
    display: flex;
    flex-direction: column;

    align-items: center;
    margin: 0 16px;
    height: 160.031px;
    width: 100%;


}

.upperinfo_dw {
    width: 100%;
    height: 18px;

}

.svgsvg {
    margin-right: 10px;
}

.hrhr {
    border: none;
    margin-bottom: 18px;
    box-sizing: content-box;
    height: 1px;
    width: 100%;
    overflow: visible;
    overflow-x: visible;
    overflow-y: visible;
    border-bottom: 1px dashed #d3d3d3;
}

.list {
    list-style: none;
    display: flex;
    margin-right: 24px;
    justify-content: space-between;
    align-items: center;

}

.afaw {
    color: #3d9b6d;
    margin-left: 9px;
    margin-top: 1px;

    font-family: 'Kanit', sans-serif;
    font-weight: 700;
}

.lf_lf {
    text-align: center;
    border: 1px solid #e9e9eb;
    border-radius: 6px;
    width: 56px;
    display: flex;
    max-width: 100px;
    box-sizing: content-box;
    height: 53.5px;
    justify-content: center;
    padding: 10px;
    box-shadow: 0 1px 5px #f9f9f9;
    flex-direction: column;
    align-items: center;
}

.ul {
    display: flex;
    flex-direction: row;
    height: 100%;
    width: 100%;
    align-items: flex-start;
    justify-content: start;
}

.timespan {
    font-family: 'Kanit', sans-serif;
    color: #3e4152;
    font-size: 15px;
    font-weight: 700;
}

.Coupen_wrap {
    margin-top: 4px;
    margin-bottom: 4px;
    display: flex;
    margin-left: 4px;
    flex-direction: column;
    align-self: stretch;
    justify-content: center;
}

.fwsea {
    font-size: 11px;
    color: #8b8d97;
    font-family: 'Kanit', sans-serif;
    width: 106%;
    font-weight: 600;
}

.coupen_cont {
    width: 100%;

    height: 78.2188px;
    display: flex;
    margin-top: 18px;
    justify-content: start;

    align-items: center
}

.asdasddds {
    justify-content: end;
    display: flex;
    align-items: end;
}

.Copen_card_cont {
    height: 68.2188px;
    border: 1px solid yellow;
    display: flex;
    overflow: hidden;
    border: 1px solid #e9e9eb;
    box-sizing: border-box;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
    border-radius: 8px;
    padding: 8px;
    flex-direction: column;
    /* margin-top: 18px; */
    margin-right: 12px;
    min-width: 200px;


}

.offer_icon {
    width: 20px;
    height: 20px;
    margin-right: 8px;
}

.cp_up {
    font-size: 1.07rem;
    font-weight: 600;
    white-space: nowrap;
    color: #686b78;
    margin-top: 1px;
    line-height: 17.976px;
    font-size: 14.98px;
    font-family: 'Kanit', sans-serif;
}

.askdf {
    display: flex;

    align-items: center;

    flex-direction: row;
    width: 149.812px;
}

.afas {
    font-size: 11.04px;
    color: #93959f;
    margin-top: 4px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 200px;
    font-family: 'Kanit', sans-serif;
    font-weight: 700;
}

input[type="checkbox"].toggle {
    opacity: 0;
    position: absolute;
    top: -90000px;
    left: -9000px;
    position: absolute;
}



input[type="checkbox"].toggle:checked + label {
    color: #0f8a65;

}

input[type="checkbox"].toggle + label {
    display: flex;
    width: 45px;
    position: relative;
}

input[type="checkbox"].toggle + label::before {
    content: '';
    width: 36px;
    height: 18px;
    margin-right: .25em;
    transition: all .25s linear;
    border-radius: 4px;
    background-color: #d4d5d9;
}

input[type="checkbox"].toggle:checked + label::before {
    background-color: rgb(0, 128, 0)
}

input[type="checkbox"].toggle + label::after {
    transition: all .25s linear;
    margin-left: 1px;
    margin-right: 2px;
    content: "";
    background-color: #fff;
    width: 18px;
    box-sizing: border-box;
    height: 18px;
    position: absolute;
    left: 0;
    border: 2px solid #d4d5d9;
    border-radius: 4px;


}

.affserttr {
    color: #7e808c;
    font-size: 14px;
    display: inline-block;
}

.asfff {
    margin-right: 12px;
}

input[type="checkbox"].toggle:checked + label::after {
    content: "\25CF";
    transform: translateX(100%);
    display: flex;
    justify-content: center;
    border: 2px solid rgb(0, 128, 0);
    align-items: center;
    background-color: #fff;


}

.veg {
    display: flex;
    margin-top: 24px;
    flex-direction: row;
    justify-content: start;
    width: 100%;
    margin-left: 13px;
    align-items: center;
}

.asmod {
    border-top: 2px solid #f1f1f6;
    height: 0.5px;
    margin: 24px auto;
    width: calc(100% - 32px);
}

.vegl {
    width: 20px;
}

.btnnnnn {
    position: absolute;
    width: 96px;
    height: 36px;
    background-color: white;
    bottom: 15px;
    left: 10%;
    border: 1px solid #d4d5d9;
    color: #60b246;
    box-shadow: 0 3px 8px #e9e9eb;
    border-radius: 4px;
}

.asdasdasd {
    position: absolute;
    height: 20px;
    width: 30px;

}

.vegonly {
    font-size: 14px;
    color: #3d4152;
    font-weight: 600;
    margin-right: 20px;
    font-family: 'Kanit', sans-serif;
    ;
}

.main_drop_cont {
    display: flex;
    justify-content: start;
    align-items: start;
    margin-bottom: 20px;
    flex-direction: column;
    width: 100%;


}

.dis_box_cont {
    height: 135px;
    max-width: 100%;
    width: 100%;

    display: flex;
    align-items: start;
    justify-content: space-between;
    flex-direction: row;


}

.dividessss {
    border-bottom: 0.5px solid #d3d3d3;
    height: 0.5px;

    width: 100%;
    margin: 20px 0;
}

.items_in_search {
    font-family: 'Kanit', sans-serif;
    color: #3e4152;
    ;
    cursor: pointer;
    font-size: 20px;

}

.upperad {
    width: calc(100% - 30px);
    border-bottom: dashed 2px grey;
    height: 100px;
    display: flex;
    margin-top: 20px;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    margin-left: 30px;
    ;
}

.sufhhd {
    margin-left: 30px;
}

.sfs {
    width: 100%;
    display: flex;
    margin-top: 30px;
    align-items: center;
    justify-content: start;
    flex-direction: row;
}

.wrapeitup {
    border-bottom: 1px solid grey;
    margin-top: 20px;
}

.adassaa {
    font-size: 14px;
    font-family: 'Kanit', sans-serif;
}

/* resdata.length===0 */

.asdwowo {
    width: 18px;
    margin-right: 7px;
}

.peretnaddon {
    height: 100vh;

    width: 100vw;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 300000;
    position: fixed;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, .3);
}

.peretnaddon2 {
    height: 100vh;
    width: 100vw;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 300000;
    position: fixed;
    top: 50%;
    display: flex;
    align-items: end;
    justify-content: center;
    background-color: rgba(0, 0, 0, .3);
}

.MenuFabButton_btnIcon__2AJv2 {
    margin-right: 6px;
    font-size: .86rem;
}

.showmenubtn {
    width: 150px;
    height: 40px;
    border-radius: 30px;
    background: #5d8ed5;
    color: white;
    text-align: center;
    box-shadow: 0 5px 10px 0 rgba(0, 0, 0, .3), 0 2px 1px 0 rgba(93, 141, 213, .2);
    padding: 14px;
    font-weight: 600;
    font-size: .93rem;
    bottom: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    will-change: transform;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    transform: scaleX(1);
    transition: transform .25s ease-in-out;
    z-index: 300000;
    position: fixed;
}

.diajkfjj {
    width: 30px;
}

.asfas {
    height: 30px;
    margin-right: 12px;
    cursor: pointer;
    margin-top: -66px;

}

.nameadd {
    height: 100%;

}

.addonitems {
    flex-direction: column;
    justify-content: flex-start;
    align-items: start;
    display: flex;
    width: 100%;
    padding-left: 47px;
    overflow: scroll;
}

.addonitems::-webkit-scrollbar {
    display: none;
}

.afdssd {
    display: flex;
    margin-bottom: 20px;
    align-items: center;
    justify-content: center;
    flex-direction: row;

}

.asdijijjjs {
    font-family: 'Kanit', sans-serif;
    padding: 11px px 16px;
    background-color: #60b246;
    color: #fff;
    position: relative;
    font-weight: 600;
    font-size: 15px;
    cursor: pointer;
    text-transform: uppercase;
}

.TEXTNOADDON {
    margin-left: 142px;
    margin-top: 168px;

    font-family: 'Kanit', sans-serif;
}

.noaddon {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-items: center;
}

.checkout {
    color: #fff;
    cursor: pointer;
    background-color: #60b246;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 90%;
    margin-top: 10px;
    margin-left: -1px;
    padding: 11px 16px;
    font-size: 15px;
    font-weight: 600;
    display: flex;
    position: relative;
}

.eachmenui {
    width: 100%;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;

}

.eachmenui:last-child {
    margin-bottom: 0;
}

::-webkit-scrollbar {
    width: 20px;
}

::-webkit-scrollbar-track {
    background-color: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: #d6dee1;
    border-radius: 20px;
    border: 6px solid transparent;
    background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
    background-color: #a8bbbf;
}

.dsad {
    text-transform: capitalize;
    overflow: hidden;
    font-weight: 100;
    font-family: 'Kanit', sans-serif;
    white-space: nowrap;
}

.showmenudiv {
    border-radius: 12px;
    overflow-y: scroll;
    display: flex;
    margin-bottom: 80px;
    padding: 26px 24px 26px 40px;
    align-items: start;
    justify-content: start;
    background-color: white;
    flex-direction: column;
    /* position: fixed; */
    /* top: 50%; */
    background-color: #fff;
    box-shadow: 0 2px 20px 0 rgba(40, 44, 63, .15);
    /* left: 50%;
    transform: translate(-50%, -50%); */
    z-index: 3000001;
    ;
    width:
        500px;
    height: 324px;
}



.addondiv {
    display: flex;
    position: fixed;
    align-items: center;
    margin-top: 30px;
    justify-content: start;
    background-color: white;
    flex-direction: column;
    /* position: fixed; */
    /* top: 50%; */
    background-color: #fff;
    box-shadow: 0 2px 20px 0 rgba(40, 44, 63, .15);
    /* left: 50%;
    transform: translate(-50%, -50%); */
    z-index: 29999;
    ;
    width:
        600px;
    height: 715px;
}

.ppeerr {
    display: flex;
    width: 800px;
    /* position: relative; */
    flex-direction: column;
}

.disrh {
    max-width: calc(100% - 144px);
    width: 100%;
    display: flex;
    flex-direction: column;
    height: 140.672px;

}

.ehs {
    width: 118px;
    position: relative;
    z-index: 1;
    height: 96px;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 6px;
}

.disll {
    position: relative;
    margin-left: 16px;
    min-width: 118px;
    height: 120px;
    text-align: center;
    font-size: 0;

}

.text_item_m {
    margin-right: 4px;
    font-size: 17.08px;
    font-weight: 500;
    color: #3e4152;
    font-family: 'Kanit', sans-serif;
    word-break: break-word;
}

.text_item_p {
    font-family: 'Kanit', sans-serif;
}

.text_item_d {
    overflow: hidden;
    height: 100%;
    margin-top: 14px;
    line-height: 1.3;
    color: rgba(40, 44, 63, .45);
    width: 100%;
    font-family: 'Kanit', sans-serif;
    font-size: 14px;
    letter-spacing: -.3px;

}

.aosin {
    border-bottom: 0.5px solid #d3d3d3;
    height: 0.5px;
    width: 100%;
    margin: 20px 0;
}

.drop_head {
    margin-bottom: 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    width: 100%;

    box-sizing: border-box;
}

svg:not(:root) {
    overflow: hidden;
}

._2MSid {
    fill: #fff;
    stroke-width: 2px;
    stroke: #282c3f;
}

._1GTCc {
    position: relative;
    stroke: currentColor;
    fill: #3d4152;
    stroke-width: 0;
}

._1GTCsc {
    position: relative;
    stroke: #93959f;
    ;
    fill: #ffffff;
    stroke-width: 1;
}

._2vS77 {
    font-size: 14px;
    font-weight: 600;
    top: 13px;
    position: absolute;
    left: 7px;
}

.aijf {
    font-family: 'Kanit', sans-serif;
    color: #3e4152;
    font-weight: 800;
    font-size: 18.2px;
}

.asuif {
    cursor: pointer;

    width: 20px;
}

.itemt {
    margin-right: 20px;
}

.navdiv {
    display: flex;
    align-items: center;
    position: relative;
    flex-direction: row;
    justify-content: center;
}

.text_off {
    font-family: 'Kanit', sans-serif;
    font-size: 30px;
    margin-top: 30px;
}

.tag_nav {
    margin-left: 10px;
    font-family: 'Kanit', sans-serif;
    color: #3d4152;
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    font-weight: 500;

}

.asddd {
    text-decoration: none;
}

._3yZyp {
    left: 0;
    line-height: 0;
}

.search_cont {
    padding-bottom: 48px;
    min-height: 100vh;
    width: 800px;

    margin: 20px auto 0;
}

.Search_item_res {
    width: 100%;
    font-size: 1.1rem;
    line-height: 20px;
    width: 100%;
    height: 100%;
    outline: 0;
    border: none;
    overflow: hidden;

    font-family: 'Noto Sans', sans-serif;


    color: inherit;
    background: inherit;
    vertical-align: middle;
}

.Search_item_res::-webkit-input-placeholder {
    font-family: 'Kanit', sans-serif;
}



.sfaasd {
    width: 100%;
    height: auto;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    display: flex;
}

.sahua {
    padding: 16px;
    font-weight: 600;
    position: relative;
    overflow: hidden;
    display: inline-block;
    background: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    text-align: left;
    line-height: 0;
    height: 100%;
}

.search_bar {
    width: 100%;
    border-bottom: 1px solid rgba(40, 44, 63, .2);
    height: 52px;
    ;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
}










label {
    cursor: pointer;
}

a {
    margin: 0;
    padding: 0;
    vertical-align: baseline;
    background: transparent;
    text-decoration: none;
    color: #000;
}

input,
select,
button,
textarea {
    margin: 0;
    font-size: 100%;
}

html,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
input {
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}


.top-header:before {
    background-image: url(https://1.bp.blogspot.com/-gxsOcYWghHA/Xp_izTh4sFI/AAAAAAAAU8s/y637Fwg99qAuzW9na_NT_uApny8Vce95gCEwYBhgL/s1600/header-footer-gradient-bg.png);
}

.top-header:before {
    content: '';
    display: block;
    width: 100%;
    height: 4px;
    background-repeat: repeat-x;
    background-size: contain;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.5;
}


.starsec {
    content: " ";
    position: absolute;
    width: 3px;
    height: 3px;
    background: transparent;
    box-shadow: 571px 173px #00BCD4, 1732px 143px #00BCD4, 1745px 454px #FF5722, 234px 784px #00BCD4, 1793px 1123px #FF9800, 1076px 504px #03A9F4, 633px 601px #FF5722, 350px 630px #FFEB3B, 1164px 782px #00BCD4, 76px 690px #3F51B5, 1825px 701px #CDDC39, 1646px 578px #FFEB3B, 544px 293px #2196F3, 445px 1061px #673AB7, 928px 47px #00BCD4, 168px 1410px #8BC34A, 777px 782px #9C27B0, 1235px 1941px #9C27B0, 104px 1690px #8BC34A, 1167px 1338px #E91E63, 345px 1652px #009688, 1682px 1196px #F44336, 1995px 494px #8BC34A, 428px 798px #FF5722, 340px 1623px #F44336, 605px 349px #9C27B0, 1339px 1344px #673AB7, 1102px 1745px #3F51B5, 1592px 1676px #2196F3, 419px 1024px #FF9800, 630px 1033px #4CAF50, 1995px 1644px #00BCD4, 1092px 712px #9C27B0, 1355px 606px #F44336, 622px 1881px #CDDC39, 1481px 621px #9E9E9E, 19px 1348px #8BC34A, 864px 1780px #E91E63, 442px 1136px #2196F3, 67px 712px #FF5722, 89px 1406px #F44336, 275px 321px #009688, 592px 630px #E91E63, 1012px 1690px #9C27B0, 1749px 23px #673AB7, 94px 1542px #FFEB3B, 1201px 1657px #3F51B5, 1505px 692px #2196F3, 1799px 601px #03A9F4, 656px 811px #00BCD4, 701px 597px #00BCD4, 1202px 46px #FF5722, 890px 569px #FF5722, 1613px 813px #2196F3, 223px 252px #FF9800, 983px 1093px #F44336, 726px 1029px #FFC107, 1764px 778px #CDDC39, 622px 1643px #F44336, 174px 1559px #673AB7, 212px 517px #00BCD4, 340px 505px #FFF, 1700px 39px #FFF, 1768px 516px #F44336, 849px 391px #FF9800, 228px 1824px #FFF, 1119px 1680px #FFC107, 812px 1480px #3F51B5, 1438px 1585px #CDDC39, 137px 1397px #FFF, 1080px 456px #673AB7, 1208px 1437px #03A9F4, 857px 281px #F44336, 1254px 1306px #CDDC39, 987px 990px #4CAF50, 1655px 911px #00BCD4, 1102px 1216px #FF5722, 1807px 1044px #FFF, 660px 435px #03A9F4, 299px 678px #4CAF50, 1193px 115px #FF9800, 918px 290px #CDDC39, 1447px 1422px #FFEB3B, 91px 1273px #9C27B0, 108px 223px #FFEB3B, 146px 754px #00BCD4, 461px 1446px #FF5722, 1004px 391px #673AB7, 1529px 516px #F44336, 1206px 845px #CDDC39, 347px 583px #009688, 1102px 1332px #F44336, 709px 1756px #00BCD4, 1972px 248px #FFF, 1669px 1344px #FF5722, 1132px 406px #F44336, 320px 1076px #CDDC39, 126px 943px #FFEB3B, 263px 604px #FF5722, 1546px 692px #F44336;
    animation: animStar 150s linear infinite;
}

.starthird {
    content: " ";
    position: absolute;
    width: 3px;
    height: 3px;
    background: transparent;
    box-shadow: 571px 173px #00BCD4, 1732px 143px #00BCD4, 1745px 454px #FF5722, 234px 784px #00BCD4, 1793px 1123px #FF9800, 1076px 504px #03A9F4, 633px 601px #FF5722, 350px 630px #FFEB3B, 1164px 782px #00BCD4, 76px 690px #3F51B5, 1825px 701px #CDDC39, 1646px 578px #FFEB3B, 544px 293px #2196F3, 445px 1061px #673AB7, 928px 47px #00BCD4, 168px 1410px #8BC34A, 777px 782px #9C27B0, 1235px 1941px #9C27B0, 104px 1690px #8BC34A, 1167px 1338px #E91E63, 345px 1652px #009688, 1682px 1196px #F44336, 1995px 494px #8BC34A, 428px 798px #FF5722, 340px 1623px #F44336, 605px 349px #9C27B0, 1339px 1344px #673AB7, 1102px 1745px #3F51B5, 1592px 1676px #2196F3, 419px 1024px #FF9800, 630px 1033px #4CAF50, 1995px 1644px #00BCD4, 1092px 712px #9C27B0, 1355px 606px #F44336, 622px 1881px #CDDC39, 1481px 621px #9E9E9E, 19px 1348px #8BC34A, 864px 1780px #E91E63, 442px 1136px #2196F3, 67px 712px #FF5722, 89px 1406px #F44336, 275px 321px #009688, 592px 630px #E91E63, 1012px 1690px #9C27B0, 1749px 23px #673AB7, 94px 1542px #FFEB3B, 1201px 1657px #3F51B5, 1505px 692px #2196F3, 1799px 601px #03A9F4, 656px 811px #00BCD4, 701px 597px #00BCD4, 1202px 46px #FF5722, 890px 569px #FF5722, 1613px 813px #2196F3, 223px 252px #FF9800, 983px 1093px #F44336, 726px 1029px #FFC107, 1764px 778px #CDDC39, 622px 1643px #F44336, 174px 1559px #673AB7, 212px 517px #00BCD4, 340px 505px #FFF, 1700px 39px #FFF, 1768px 516px #F44336, 849px 391px #FF9800, 228px 1824px #FFF, 1119px 1680px #FFC107, 812px 1480px #3F51B5, 1438px 1585px #CDDC39, 137px 1397px #FFF, 1080px 456px #673AB7, 1208px 1437px #03A9F4, 857px 281px #F44336, 1254px 1306px #CDDC39, 987px 990px #4CAF50, 1655px 911px #00BCD4, 1102px 1216px #FF5722, 1807px 1044px #FFF, 660px 435px #03A9F4, 299px 678px #4CAF50, 1193px 115px #FF9800, 918px 290px #CDDC39, 1447px 1422px #FFEB3B, 91px 1273px #9C27B0, 108px 223px #FFEB3B, 146px 754px #00BCD4, 461px 1446px #FF5722, 1004px 391px #673AB7, 1529px 516px #F44336, 1206px 845px #CDDC39, 347px 583px #009688, 1102px 1332px #F44336, 709px 1756px #00BCD4, 1972px 248px #FFF, 1669px 1344px #FF5722, 1132px 406px #F44336, 320px 1076px #CDDC39, 126px 943px #FFEB3B, 263px 604px #FF5722, 1546px 692px #F44336;
    animation: animStar 10s linear infinite;
}

.starfourth {
    content: " ";
    position: absolute;
    width: 2px;
    height: 2px;
    background: transparent;
    box-shadow: 571px 173px #00BCD4, 1732px 143px #00BCD4, 1745px 454px #FF5722, 234px 784px #00BCD4, 1793px 1123px #FF9800, 1076px 504px #03A9F4, 633px 601px #FF5722, 350px 630px #FFEB3B, 1164px 782px #00BCD4, 76px 690px #3F51B5, 1825px 701px #CDDC39, 1646px 578px #FFEB3B, 544px 293px #2196F3, 445px 1061px #673AB7, 928px 47px #00BCD4, 168px 1410px #8BC34A, 777px 782px #9C27B0, 1235px 1941px #9C27B0, 104px 1690px #8BC34A, 1167px 1338px #E91E63, 345px 1652px #009688, 1682px 1196px #F44336, 1995px 494px #8BC34A, 428px 798px #FF5722, 340px 1623px #F44336, 605px 349px #9C27B0, 1339px 1344px #673AB7, 1102px 1745px #3F51B5, 1592px 1676px #2196F3, 419px 1024px #FF9800, 630px 1033px #4CAF50, 1995px 1644px #00BCD4, 1092px 712px #9C27B0, 1355px 606px #F44336, 622px 1881px #CDDC39, 1481px 621px #9E9E9E, 19px 1348px #8BC34A, 864px 1780px #E91E63, 442px 1136px #2196F3, 67px 712px #FF5722, 89px 1406px #F44336, 275px 321px #009688, 592px 630px #E91E63, 1012px 1690px #9C27B0, 1749px 23px #673AB7, 94px 1542px #FFEB3B, 1201px 1657px #3F51B5, 1505px 692px #2196F3, 1799px 601px #03A9F4, 656px 811px #00BCD4, 701px 597px #00BCD4, 1202px 46px #FF5722, 890px 569px #FF5722, 1613px 813px #2196F3, 223px 252px #FF9800, 983px 1093px #F44336, 726px 1029px #FFC107, 1764px 778px #CDDC39, 622px 1643px #F44336, 174px 1559px #673AB7, 212px 517px #00BCD4, 340px 505px #FFF, 1700px 39px #FFF, 1768px 516px #F44336, 849px 391px #FF9800, 228px 1824px #FFF, 1119px 1680px #FFC107, 812px 1480px #3F51B5, 1438px 1585px #CDDC39, 137px 1397px #FFF, 1080px 456px #673AB7, 1208px 1437px #03A9F4, 857px 281px #F44336, 1254px 1306px #CDDC39, 987px 990px #4CAF50, 1655px 911px #00BCD4, 1102px 1216px #FF5722, 1807px 1044px #FFF, 660px 435px #03A9F4, 299px 678px #4CAF50, 1193px 115px #FF9800, 918px 290px #CDDC39, 1447px 1422px #FFEB3B, 91px 1273px #9C27B0, 108px 223px #FFEB3B, 146px 754px #00BCD4, 461px 1446px #FF5722, 1004px 391px #673AB7, 1529px 516px #F44336, 1206px 845px #CDDC39, 347px 583px #009688, 1102px 1332px #F44336, 709px 1756px #00BCD4, 1972px 248px #FFF, 1669px 1344px #FF5722, 1132px 406px #F44336, 320px 1076px #CDDC39, 126px 943px #FFEB3B, 263px 604px #FF5722, 1546px 692px #F44336;
    animation: animStar 50s linear infinite;
}

.starfifth {
    content: " ";
    position: absolute;
    width: 1px;
    height: 1px;
    background: transparent;
    box-shadow: 571px 173px #00BCD4, 1732px 143px #00BCD4, 1745px 454px #FF5722, 234px 784px #00BCD4, 1793px 1123px #FF9800, 1076px 504px #03A9F4, 633px 601px #FF5722, 350px 630px #FFEB3B, 1164px 782px #00BCD4, 76px 690px #3F51B5, 1825px 701px #CDDC39, 1646px 578px #FFEB3B, 544px 293px #2196F3, 445px 1061px #673AB7, 928px 47px #00BCD4, 168px 1410px #8BC34A, 777px 782px #9C27B0, 1235px 1941px #9C27B0, 104px 1690px #8BC34A, 1167px 1338px #E91E63, 345px 1652px #009688, 1682px 1196px #F44336, 1995px 494px #8BC34A, 428px 798px #FF5722, 340px 1623px #F44336, 605px 349px #9C27B0, 1339px 1344px #673AB7, 1102px 1745px #3F51B5, 1592px 1676px #2196F3, 419px 1024px #FF9800, 630px 1033px #4CAF50, 1995px 1644px #00BCD4, 1092px 712px #9C27B0, 1355px 606px #F44336, 622px 1881px #CDDC39, 1481px 621px #9E9E9E, 19px 1348px #8BC34A, 864px 1780px #E91E63, 442px 1136px #2196F3, 67px 712px #FF5722, 89px 1406px #F44336, 275px 321px #009688, 592px 630px #E91E63, 1012px 1690px #9C27B0, 1749px 23px #673AB7, 94px 1542px #FFEB3B, 1201px 1657px #3F51B5, 1505px 692px #2196F3, 1799px 601px #03A9F4, 656px 811px #00BCD4, 701px 597px #00BCD4, 1202px 46px #FF5722, 890px 569px #FF5722, 1613px 813px #2196F3, 223px 252px #FF9800, 983px 1093px #F44336, 726px 1029px #FFC107, 1764px 778px #CDDC39, 622px 1643px #F44336, 174px 1559px #673AB7, 212px 517px #00BCD4, 340px 505px #FFF, 1700px 39px #FFF, 1768px 516px #F44336, 849px 391px #FF9800, 228px 1824px #FFF, 1119px 1680px #FFC107, 812px 1480px #3F51B5, 1438px 1585px #CDDC39, 137px 1397px #FFF, 1080px 456px #673AB7, 1208px 1437px #03A9F4, 857px 281px #F44336, 1254px 1306px #CDDC39, 987px 990px #4CAF50, 1655px 911px #00BCD4, 1102px 1216px #FF5722, 1807px 1044px #FFF, 660px 435px #03A9F4, 299px 678px #4CAF50, 1193px 115px #FF9800, 918px 290px #CDDC39, 1447px 1422px #FFEB3B, 91px 1273px #9C27B0, 108px 223px #FFEB3B, 146px 754px #00BCD4, 461px 1446px #FF5722, 1004px 391px #673AB7, 1529px 516px #F44336, 1206px 845px #CDDC39, 347px 583px #009688, 1102px 1332px #F44336, 709px 1756px #00BCD4, 1972px 248px #FFF, 1669px 1344px #FF5722, 1132px 406px #F44336, 320px 1076px #CDDC39, 126px 943px #FFEB3B, 263px 604px #FF5722, 1546px 692px #F44336;
    animation: animStar 80s linear infinite;
}

@keyframes animStar {
    0% {
        transform: translateY(0px);
    }

    100% {
        transform: translateY(-2000px);
    }
}



button {
    border: none;
    padding: 0;
    font-size: 0;
    line-height: 0;
    background: none;
    cursor: pointer;
}

:focus {
    outline: 0;
}

.clearfix:before,
.clearfix:after {
    content: "\0020";
    display: block;
    height: 0;
    visibility: hidden;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    zoom: 1;
}

/* 1. END BODY */
/***********************************/

/***********************************
			/* 2. CONTENT */
/***********************************/
/* 2.1. Section error */
.error {
    min-height: 100vh;
    position: relative;
    padding: 240px 0;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    text-align: center;
    margin-top: 70px;
}

.error__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.error__content {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.error__message {
    text-align: center;
    color: #181828;
}

.message__title {
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 5px;
    font-size: 5.6rem;
    padding-bottom: 40px;
    max-width: 960px;
    margin: 0 auto;
}

.message__text {
    font-family: 'Montserrat', sans-serif;
    line-height: 42px;
    font-size: 18px;
    padding: 0 60px;
    max-width: 680px;
    margin: auto;
}

.error__nav {
    max-width: 600px;
    margin: 40px auto 0;
    text-align: center;
}

.e-nav__form {
    position: relative;
    height: 45px;
    overflow: hidden;
    width: 170px;
    display: inline-block;
    vertical-align: top;
    border: 1px solid #212121;
    padding-left: 10px;
    padding-right: 46px;
}

.e-nav__icon {
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    color: #212121;
    -webkit-transition: color .25s ease;
    transition: color .25s ease;
}

.e-nav__link {
    height: 45px;
    line-height: 45px;
    width: 170px;
    display: inline-block;
    vertical-align: top;
    margin: 0 15px;
    border: 1px solid #181828;
    color: #181828;
    text-decoration: none;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: .1rem;
    position: relative;
    overflow: hidden;
}

.e-nav__link:before {
    content: '';
    height: 200px;
    background: #212121;
    position: absolute;
    top: 70px;
    right: 70px;
    width: 260px;
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-transform: rotate(50deg);
    transform: rotate(50deg);
}

.e-nav__link:after {
    -webkit-transition: all .3s;
    transition: all .3s;
    z-index: 999;
    position: relative;
}

.e-nav__link:after {
    content: "Home Page";
}

.e-nav__link:hover:before {
    top: -60px;
    right: -50px;
}

.e-nav__link:hover {
    color: #fff;
}

.e-nav__link:nth-child(2):hover:after {
    color: #fff;
}

/* 2.1. END Section Error */

/* 2.2. Social style */
.error__social {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 20px;
    z-index: 10;
}

.e-social__list {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.e-social__icon {
    padding-bottom: 30px;
}

.e-social__icon:last-child {
    padding-bottom: 0;
}

.e-social__link {
    color: #fff;
    -webkit-transition: all .25s ease;
    transition: all .25s ease;
    display: block;
}

.e-social__link:hover {
    opacity: .7;
}

/* 2.2. END Social style */

/* 2.3. Lamp */
.lamp {
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    margin: 0px auto;
    width: 300px;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform-origin: center top;
    animation-timing-function: cubic-bezier(0.6, 0, 0.38, 1);
    animation: move 5.1s infinite;
}

@keyframes move {
    0% {
        transform: rotate(40deg);
    }

    50% {
        transform: rotate(-40deg);
    }

    100% {
        transform: rotate(40deg);
    }
}

.cable {
    width: 8px;
    height: 248px;
    background-image: linear-gradient(rgb(32 148 218 / 70%), rgb(193 65 25)), linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
}

.cover {
    width: 200px;
    height: 80px;
    background: #0bd5e8;
    border-top-left-radius: 50%;
    border-top-right-radius: 50%;
    position: relative;
    z-index: 200;
}

.in-cover {
    width: 100%;
    max-width: 200px;
    height: 20px;
    border-radius: 100%;
    background: #08ffff;
    position: absolute;
    left: 0px;
    right: 0px;
    margin: 0px auto;
    bottom: -9px;
    z-index: 100;
}

.in-cover .bulb {
    width: 50px;
    height: 50px;
    background-color: #08fffa;
    border-radius: 50%;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: -20px;
    margin: 0px auto;
    -webkit-box-shadow: 0 0 15px 7px rgba(0, 255, 255, 0.8), 0 0 40px 25px rgba(0, 255, 255, 0.5), -75px 0 30px 15px rgba(0, 255, 255, 0.2);
    box-shadow: 0 0 25px 7px rgb(127 255 255 / 80%), 0 0 64px 47px rgba(0, 255, 255, 0.5), 0px 0 30px 15px rgba(0, 255, 255, 0.2);
}

.effor {
    background: #181828;
    font-size: 14px;
    line-height: 1;
}

.app {

    display: flex;
    flex-direction: column;
}

.light {
    width: 200px;
    height: 0px;
    border-bottom: 900px solid rgb(44 255 255 / 24%);
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    position: absolute;
    left: 0px;
    right: 0px;
    top: 270px;
    margin: 0px auto;
    z-index: 1;
    border-radius: 90px 90px 0px 0px;
}


.error {
    overflow: hidden;
    max-height: 100vh;
}

.btnnnnn {
    position: absolute;
    width: 96px;
    height: 36px;
    background-color: white;
    bottom: 15px;
    left: 10%;
    border: 1px solid #d4d5d9;
    color: #60b246;
    box-shadow: 0 3px 8px #e9e9eb;
    border-radius: 4px;
}

.asdasdasd {
    position: absolute;
    height: 20px;
    width: 30px;

}

@media (max-width: 1400px) {
    .lamp {
        zoom: .5;
    }

    .error__content {
        top: 55%;
    }

    .message__title {
        font-size: 3.5rem;
    }
}

@media (max-width: 900px) {

    .message__title {
        font-size: 34px;

    }

    .error__content {
        top: 55%;
    }
}

@media (max-width: 950px) {
    .lamp__wrap {
        max-height: 100vh;
        overflow: hidden;
        max-width: 100vw;
    }

    .error__social {
        bottom: 30px;
        top: auto;
        transform: none;
        width: 100%;
        position: fixed;
        left: 0;
    }

    .e-social__icon {
        display: inline-block;
        padding-right: 30px;
    }

    .e-social__icon:last-child {
        padding-right: 0;
    }

    .e-social__icon {
        padding-bottom: 0;
    }
}

.btnnnnn {
    position: absolute;
    width: 96px;
    height: 36px;
    background-color: white;
    bottom: 15px;
    left: 10%;
    border: 1px solid #d4d5d9;
    color: #60b246;
    box-shadow: 0 3px 8px #e9e9eb;
    border-radius: 4px;
}

.asdasdasd {
    position: absolute;
    height: 20px;
    width: 30px;

}

@media (max-width: 750px) {



    .error__content {
        position: static;
        margin: 0 auto;
        transform: none;
        padding-top: 300px;
    }

    .error {
        padding-top: 0;
        padding-bottom: 100px;
        height: 100vh;
    }
}

@media (max-width: 650px) {
    .message__title {
        font-size: 36px;
        padding-bottom: 20px;
    }

    .message__text {
        font-size: 16px;
        line-height: 2;
        padding-right: 20px;
        padding-left: 20px;
    }

    .lamp {
        zoom: .6;
    }

    .error__content {
        padding-top: 180px;
    }
}

@media (max-width: 480px) {

    .message__title {
        font-size: 30px;
    }

    .message__text {
        padding-left: 10px;
        padding-right: 10px;
        font-size: 15px;
    }

    .error__nav {
        margin-top: 20px;
    }
}

._3MtuI {
    padding: 7px 0 7px 50px;
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    overflow: hidden;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    height: 40px;
}


input[type=checkbox] {
    position: relative;
    border: 1px solid #a9abb2;
    border-radius: 2px;
    background: none;
    cursor: pointer;
    line-height: 0;
    margin: 0 .6em 0 0;
    outline: 0;
    padding: 0 !important;
    vertical-align: text-top;
    height: 20px;
    width: 20px;

    opacity: .5;
}

.asdassdd {
    margin-right: 9px;
    font-size: 17px;
    font-family: 'Kanit', sans-serif;

}

input[type=checkbox]:hover {
    opacity: 1;
}

input[type=checkbox]:checked {
    background-color: #60b246;
    ;
    opacity: 1;
}

input[type=checkbox]:before {
    content: '';
    position: absolute;
    right: 50%;
    top: 50%;
    width: 4px;
    height: 10px;
    border: solid #FFF;
    border-width: 0 2px 2px 0;
    margin: -1px -1px 0 -1px;
    transform: rotate(45deg) translate(-50%, -50%);
    z-index: 2;
}



.sfasasd {
    font-family: 'Kanit', sans-serif;
    margin-top: 6px;
}

.aiunf {
    font-family: 'Kanit', sans-serif;
    font-weight: 500;
    font-size: 20px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    max-width: 490px;
}

.middleadd {

    flex-direction: column;
    justify-content: flex-start;
    align-items: start;
    padding-left: 14px;
    width: 107%;

    height: 71%;
    display: flex;
}

.asdssasd {
    font-size: 14px;
    color: #686b78;
    margin-left: 4px;
    font-weight: 300;
}

.combo {
    color: #282c3f;
    font-size: 20px;
    font-weight: 600;
    padding: 20px 0 10px 50px;
    position: relative;
    font-family: 'Kanit', sans-serif;
}

@-webkit-keyframes shimmer {
    0% {
        background-position: -100% 0;
    }

    100% {
        background-position: 100% 0;
    }
}

@keyframes shimmer {
    0% {
        background-position: -1200px 0;
    }

    100% {
        background-position: 1200px 0;
    }
}

@media only screen and (max-width: 600px) {
    .app {
        overflow: hidden;
    }
}






























@media only screen and (max-width: 600px) {
    .child_cont {
        padding-right: 13px;
        padding-left: 13px;
        margin-top: 60px;
    }

    .TEXTNOADDON {
        margin-top: 199px;
        margin-left: 95px;
    }


    .res_name_rh {
        overflow: hidden;
        font-size: 14px;
        white-space: nowrap;
        text-overflow: ellipsis;
    }


    .showmenubtn {
        bottom: 19px;
    }

    .main_drop_cont:last-child {
        display: none;
    }


    .showmenudiv {
        margin-bottom: 0px;
        border-radius: 0px;
    }

    .upperad {
        border-bottom: 2px dashed gray;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        height: 100px;
        width: 100%;

        margin-top: 0px;
        margin-left: 0px;
        display: flex;
    }

    .dis_box_cont {
        height: fit-content;
        align-items: center;
    }

    .text_item_d {
        overflow: inherit;
    }

    .disrh {
        height: fit-content;
    }

    .aiunf {
        white-space: wrap;
        font-size: 16px;
    }

    .asfas {
        margin-right: 0px;
        margin-top: -44px;
    }

    .combo {
        padding-left: 0px;
    }

    .checkout {
        margin-top: 29px;
    }

    .addonitems {
        margin-left: 0px;
        padding-left: 0px;
    }

    .nameadd {
        width: 100%;
        margin-top: 20px;
        overflow: hidden;
    }

    .addondiv {
        width: 100%;
        padding-right: 13px;
        padding-left: 13px;
    }

    .search_rh {
        width: 16%;
    }

    .top_bar_small {
        height: fit-content;
        margin-top: 23px;
    }

    .upper_info {
        height: fit-content;
    }

    .upperinfo_up {
        margin-top: 20px;
    }

    .coupen_cont {
        margin-top: 1rem
    }

    .cityinput {
        display: none;
    }

    .itemss {
        margin-left: 16px;
        display: block;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .header {
        padding: 0px;
        height: 60px;
        display: flex;
        position: fixed;
        top: -1px;
        width: 100%;
        justify-content: start;
        align-items: center;
    }

    .rigt {
        width: 267.797px;
        height: 41.6094px;
        display: flex;
        align-items: start;
        padding-left: 16px;
        justify-content: start;
        flex-direction: column;
        /* margin-left: 16px; */

    }



    .up {
        display: flex;
        align-items: center;
        justify-content: start;
        flex-direction: row;
        height: 22px;
        width: 100%;

    }

    .rgpof {
        font-weight: 800;
        font-size: 18px;
        color: #3d4152;
        line-height: 19px;
        margin-left: 6px;
        letter-spacing: -.1px;
        font-family: 'Kanit', sans-serif;
        color: #3d4152;
    }

    .tabics {
        width: 82.4062px;
        height: 100%;
        display: flex;
        align-items: center;
        flex-direction: column;
        position: relative;
        justify-content: center;

        z-index: 999;
    }

    .hfg7fg {
        width: 15px;
        font-family: 'Kanit', sans-serif;
    }

    .aifuheb {
        font-size: 12px;
        font-family: 'Kanit', sans-serif;
        color: #36393e;
        font-size: .73rem;
        text-transform: uppercase;
        -webkit-font-smoothing: antialiased;
        -webkit-text-size-adjust: none;
    }

    .asfffffs {
        margin-top: 1px;
    }

    .dddfww {
        scale: 1.2;
    }

    .aifuheb-v {
        position: absolute;
        font-size: 12px;
        top: 2px;
        font-family: 'Kanit', sans-serif;
        color: #36393e;
        font-size: .73rem;
        text-transform: uppercase;
        -webkit-font-smoothing: antialiased;
        -webkit-text-size-adjust: none;
    }

    .sufhiee {
        margin-top: 70px;
        /* padding-left: 16px;
        padding-right: 16px; */
    }

    .stroke-\[3px\] {
        stroke-width: 3px;
    }

    .stroke-defGray {
        stroke: #686b78;
    }

    .name_of_hotel {
        letter-spacing: -.3px;
        color: #02060cbf;
        margin-top: -7px;
        margin-left: 16px;
        -webkit-font-smoothing: antialiased;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        /* margin: 0 -0px 0 16px; */
        overflow: hidden;
        text-overflow: ellipsis;
        font-weight: 500;
        font-family: var(--global-font-family);
        font-size: 17px;
        white-space: nowrap;
    }

    .sujhwhhr {
        width: 1.45rem;
        height: 1.45rem;
    }

    .fill-white {
        fill: #fff;
    }

    .strip-1 {
        width: 76%;
        background-color: white;
        border-radius: 4px;
        height: 8px;
        margin-left: 16px;
        margin-top: 51px;
    }

    .rating {
        width: 100%;
        margin-left: 16px;
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: start;
    }

    .time_del {
        display: none;
    }

    .strip-1c {
        width: 40%;
        background-color: white;
        border-radius: 4px;
        height: 12px;
        margin-left: 16px;
        margin-top: 36px;
    }

    @keyframes placeholderShimmer {
        0% {
            background-position: -468px 0;
        }

        100% {
            background-position: 468px 0;
        }
    }

    .shimmer-animation {
        background-color: #f6f7f8;
        background-image: linear-gradient(to right,
                #f6f7f8 0%,
                #edeef1 20%,
                #f6f7f8 40%,
                #f6f7f8 100%);
        background-repeat: no-repeat;
        background-size: 800px 238px;
        animation-duration: 1s;
        animation-fill-mode: forwards;
        animation-iteration-count: infinite;
        animation-name: placeholderShimmer;
        animation-timing-function: linear;
    }

    .strip-1cc {
        width: 80%;
        background-color: white;
        border-radius: 4px;
        height: 12px;
        margin-left: 16px;
        margin-top: 112px;
    }

    .strip-1csc {
        width: 80%;
        background-color: white;
        border-radius: 4px;
        height: 12px;
        margin-left: 16px;
        margin-top: 16px;
    }

    .strip-2 {
        width: 76%;
        background-color: white;
        border-radius: 4px;
        height: 8px;
        margin-left: 16px;
        margin-top: 14px;
    }

    .boxes {

        width: 60px;
        height: 60px;
    }

    .h {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: start;
        flex-direction: row;
    }

    .dssa {
        font-weight: 500;
        font-family: var(--global-font-family);
    }

    .dsssaa {
        font-weight: 500;
        white-space: nowrap;
        color: #7e808c;
        font-size: .86rem;
        font-family: var(--global-font-family);
    }

    .divS {
        margin-left: 16px;
        display: flex;
        justify-content: start;
        align-items: start;
        flex-direction: column;
    }

    .s {
        width: 100%;
        background-color: #DEF5D4;
        height: 60px;
        position: relative;

    }

    .saadww {
        font-family: var(--global-font-family);
        font-weight: 500;
        position: absolute;
        left: 30px;
        top: 7px;
    }

    .saadwws {
        font-family: var(--global-font-family);
        font-weight: 500;
        position: absolute;
        left: 30px;
        top: 30px;
        font-weight: 300;
        font-size: 12px;

    }

    .maeh {
        display: flex;
        flex-direction: column;
    }

    .xxx {
        display: flex;
        flex-direction: row;
    }

    .catitemsaa {
        display: flex;
        flex-direction: row;
        width: 100%;
        height: 43px;
        border: 1px solid black;
    }

    .as {
        font-family: var(--global-font-family);
        font-weight: 300;
    }

    .po {
        font-family: var(--global-font-family);
        font-weight: 300;
    }




















































    .auswrr {
        display: flex;
        width: 100%;
        margin-top: 48px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding-left: 12px;
        padding-right: 12px;
    }

    .auswrrv {
        margin-top: 30px;
        display: flex;
        width: 100%;
        flex-direction: row;
        padding-left: 19px;
        padding-right: 19px;

        align-items: center;
        justify-content: space-between;

    }

    .fjfjssjd {
        margin-top: 40px;

        width: 90%;
        height: 100px;
    }

    .fjfjssjdv {
        margin-top: 30px;

        width: 90%;
        height: 240px;
    }

    .w-5 {
        width: 1.25rem;
    }

    .h-5 {
        height: 1.25rem;
    }

    .tabsa {
        background-color: #fff;
        box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, .1);
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: start;
        width: 100%;
        z-index: 999999999;

        height: 56px;
        position: fixed;
        bottom: -2px;

    }

    .fhrhbe {
        width: 18px;
    }

    ._9v2Jj {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        font-size: .93rem;
        font-family: 'Kanit', sans-serif;
        margin-top: 2px;
        color: #686b78;
    }

    .search_cont {
        padding-right: 13px;
        padding-left: 13px;
        width: 100%;
    }

    .ppeerr {
        width: 100%;
    }

    .buttons {
        margin-right: 0px;
        display: none;
    }

    .image-res {
        width: 100%;
        height: 163px;
        object-fit: cover;
    }

    .wrapper {
        width: 100%;
        height: 166px;
    }

    .info_card {
        margin-top: -9px;
        margin-left: -12px;
    }

    .Link_card {
        min-width: 140px;
        flex-grow: 1;
        max-width: 48%;
    }

    .container-card {
        display: flex;
        justify-content: flex-start;
        flex-direction: column;
        align-items: start;
        width: 100%;

        min-width: 132px;
        overflow: hidden;
    }



    .naishdu {
        font-weight: 500;
        width: 250px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .topres {
        font-size: 20px;
        line-height: 21px;
        font-weight: 800;

    }

    .br {
        margin-bottom: 0px;
    }

    .cr_title {
        font-size: 20px;
        line-height: 2rem;
        font-weight: 700;
    }

    .Search_item_res {
        font-size: 1rem;
    }

    .dasdssawww {
        margin-top: 62px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: row;


        padding: 16px 16px 12px;
    }

    .lf_lf {
        text-align: center;
        box-sizing: content-box;
        border: 1px solid #e9e9eb;
        border-radius: 6px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 0px;
        width: 82px;
        height: 82px;
        display: flex;
        box-shadow: 0 1px 5px #f9f9f9;
    }

    .perent_div {
        height: fit-content;
    }

    .img_off_cont {
        width: fit-content;
    }

    .djir {
        width: 100%;
        height: 100%;
        vertical-align: bottom;
        width: 100%;
    }

    .Link_card {
        min-width: 140px;

        flex-grow: 1;
    }

    .bre {
        width: calc(((((100vw - 0px) - 0px) - 16px) - 28px) * 0.5);
        height: calc(0.795181 * (((((100vw - 0px) - 0px) - 16px) - 28px) * 0.5));
        min-width: calc(((((100vw - 0px) - 0px) - 16px) - 28px) * 0.5);
        min-height: calc(0.795181 * (((((100vw - 0px) - 0px) - 16px) - 28px) * 0.5));
        border-radius: 32px;

    }

    .bref {
        width: calc(((((100vw - 0px) - 0px) - 16px) - 28px) * 0.5);
        height: calc(0.795181 * (((((100vw - 0px) - 0px) - 16px) - 28px) * 0.5));
        min-width: calc(((((100vw - 0px) - 0px) - 16px) - 28px) * 0.5);
        min-height: calc(0.795181 * (((((100vw - 0px) - 0px) - 16px) - 28px) * 0.5));
        margin-left: 12px;
        border-radius: 32px;
    }

    .green {
        fill: #93959F;
    }

    .cjnsd {
        font-size: 20px;
        font-family: 'Kanit', sans-serif;
        font-weight: 900;
        color: #3d4152;

        margin-left: 12px;
        letter-spacing: -.3px;
    }

    .sjfiejhjhehhheef {
        width: calc(((((100vw - 0px) - 0px) - 20px) - 20px) * 0.8);
        height: calc(0.82432 * (((((100vw - 0px) - 0px) - 20px) - 20px) * 0.8));
        min-width: calc(((((100vw - 0px) - 0px) - 20px) - 20px) * 0.8);
        min-height: calc(0.82432 * (((((100vw - 0px) - 0px) - 20px) - 20px) * 0.8));
        margin-right: 11px;
    }

    .s0 {
        display: flex;
        position: relative;
        align-items: start;
        justify-content: start;
        flex-direction: column;
    }

    .s1 {
        height: 80px;
        width: 80px;
        background-size: cover;
        position: relative;
        background-color: rgba(40, 44, 63, .05);
        background-repeat: no-repeat;
        border-radius: 8px;
    }

    .s2 {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        max-width: 80px;
        overflow: hidden;
        font-weight: 400;
        font-size: 1rem;
        font-family: 'Kanit', sans-serif;
        padding-top: 10px;
        line-height: 16px;
        letter-spacing: -.3px;
        opacity: .9;
        color: #282c3f;
    }

    .s3 {
        font-size: 1rem;
        padding-top: 4px;
        font-family: 'Kanit', sans-serif;
        opacity: .5;
        color: #282c3f;
    }














    .w2 {
        height: 20px;
    }

    .topixs {
        display: flex;
        align-items: center;
        padding-left: 16px;
        justify-content: start;
        flex-direction: row;
    }

    .perent_slider {
        width: 100%;
    }

    .img_offer {
        width: 300px;
        height: 200px;
    }

    .container_main {
        padding-right: 13px;
        padding-left: 13px;
        margin-right: 0px;
        margin-left: 0px;
    }

    .uppar_body {
        display: none;
    }

}