


/* ********************
    coverimage
******************** */
.coverImage{
 
    background-position: top right;
    height: 800px ;
   
 
    background-color: rgba(152, 146, 149, 1);
    background-repeat: no-repeat;
} 
.coverImage-bg{
 
    background-position: top right;  
    height: 800px;
    background-color: rgba(152, 146, 149, .7);
  
} 

.contentBg-1{
    /*  background-image: url(../thumbnail/CoverImage.php?img=istockphoto-1950375322-1024x1024.jpg&width=1000)   ; 
  
   
    background-repeat: no-repeat;
    background-size: cover;  
    background-color: #d8d4d4;
    background-position: top left; */
    
    
 } 
 .div-cover-hilight {
    width: 100%;
    height: 100%;
    background-color:rgb(40 32 40 / 60%); /* rgba(146, 140, 146, .8); */
    padding: 0px;
    margin: 0px;
  /*   padding-bottom: 40px; */
}
.div-cover-hilight-bg {
    background: rgb(40 32 40 / 60%);
 
    color:#c8b7b7;
    padding-bottom: 40px;
}

.div-cover{
    background-color: rgb(72 65 72);
    color:#c8b7b7;
    padding-bottom: 50px;
}

 
.Message1{
    font-family: Pattaya;
    font-weight: normal;
    position: relative;
    top: 100px;
    margin-left: 10%;
    color: #0c0b0c;
    font-size: 16pt;
   

}
.Message2 {
    font-family: Italianno;
    font-weight: normal;
    position: relative;
    top: 80px;
    /* margin-left: 5%; */
    color: rgba(136, 22, 61,1);
    font-size: 60pt;
    text-align: center;
}

@media only screen and (min-width: 320px)  {
    /*Grid - For Mobile S : ms */
    .coverImage{
        background-image: url(../thumbnail/CoverImage.php?img=background.jpg&width=1200)   ; 
        background-position: -400px;
        height: 630px;
        
     } 
    .div-cover-hilight {
         background-color:rgb(40 32 40 / 50%);  
    }
  

}
@media only screen and (min-width: 375px)  {
     /* For Mobile M : mm */
    .coverImage{
        background-image: url(../thumbnail/CoverImage.php?img=background.jpg&width=1200)   ; 
        background-position: -400px;
        height: 630px;
        
     } 
    .div-cover-hilight {
        background-color:rgb(40 32 40 / 50%);  
    }
 
 

}
@media only screen and (min-width: 425px) {
    /* For Mobile L : ml */
    .coverImage{
        background-image: url(../thumbnail/CoverImage.php?img=background.jpg&width=1200)   ; 
        background-position: -400px;
        height: 630px;
     
     } 
     .div-cover-hilight {
        background-color:rgb(40 32 40 / 50%);  
    }
  
 
}

@media only screen and (min-width: 640px) {
    /* For Tablet widht 640: tm */
    .coverImage{
        background-image: url(../thumbnail/CoverImage.php?img=background.jpg&width=1200);
        background-position: -200px;
        height: 600px;
     } 

    .coverImage-bg{
 
        background-position: top right;  
        height: 800px;
        background-color: rgba(152, 146, 149, 0.5);
      
    } 

    .div-cover-hilight {
        background-color:rgb(40 32 40 / 80%);  
    }
    .Message1{
        margin-left: 40px;
    
    }
    .Message2 {
   
        text-align:left;
        margin-left: 10%;
        font-size: 80pt;
    }
  

}
@media only screen and (min-width: 768px) {
    /* For Tablet: t,tl */
    .coverImage {
        background-image: url(../thumbnail/CoverImage.php?img=background.jpg&width=1200);
        background-position: -100px;
        height: 600px;
    }
    .coverImage-bg{
 
        background-position: top right;  
        height: 800px;
        background-color: rgba(152, 146, 149, 0);
      
    } 
    .div-cover-hilight {
        background-color:rgb(40 32 40 / 80%); 
    }
    .Message2 {
        text-align: left;
        margin-left: 10%;
        margin-top: 10px;
        font-size: 80pt;
    }

}
@media only screen and (min-width: 1024px) {
    /* For Laptop: ls */
    .coverImage{

        background-image: url(../thumbnail/CoverImage.php?img=background.jpg&width=1300);
        background-position: -100px;
        height: 650px;
        margin-top: 0px;
    } 
    .coverImage-bg{
 
        background-position: top right;  
        height: 800px;
        background-color: rgba(152, 146, 149, 0);
      
    } 
    .div-cover-hilight {
        background-color:rgb(40 32 40 / 80%); 
    }
    .Message2 {
        text-align: left;
        margin-left: 40px;
        margin-top: 10px;
        font-size: 80pt;
    }


}
@media only screen and (min-width: 1280px) {
    /* For Laptop  width 1280 px : lm*/
    .coverImage{
        background-image: url(../thumbnail/CoverImage.php?img=background.jpg&width=1280)   ; 
        background-position: top right;
        height:650px ;
     } 
     .div-cover-hilight {
        background-color:rgb(40 32 40 / 80%); 
    }
    .Message2 {
        text-align: left;
        margin-left: 30px;
        margin-top: 10px;
        font-size: 80pt;
    }

}
@media only screen and (min-width: 1440px) {
    /* For Laptop L: ll */
    .coverImage{
        background-image: url(../thumbnail/CoverImage.php?img=background.jpg&width=1440)   ; 
        background-position: 100px;
        height: 750px ;
     } 
     .div-cover-hilight {
        background-color:rgb(40 32 40 / 80%); 
    }
     .Message1 {
        font-size: 20pt;
        margin-left: 80px;
    }
     .Message2 {
        text-align: left;
        margin-left: 70px;
        margin-top: 10px;
        font-size: 120pt;
    }

 
    
}
/* ********************
    hilight-message
******************** */
.hilight-message-cover {
    position: absolute;
    top: 300px;
    width: 480px;
    color: #ffffff;
    padding-left: 50px;
}
.hilight-message-border {
    background: rgba(149, 31, 71, .5);
    padding: 10px;
    border-radius: 10px;
}
.hilight-message-cover-title {
    font-family: Pattaya;
    font-size: 24px;
}
.hilight-message-cover-desc {
    /* font-family: Pattaya; */
    font-family: 'Taviraj', 'Trirong', 'Pridi', serif, sans-serif;
    font-size: 12px;
    margin-top: 10px;
}
.hilight-message-cover-lineoa {
    padding-top: 10px;
}
.divAddFriend-container{
    margin-top: 100px;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
}
.divAddFriend-border {
 
    display: flex;
    width: 100%;
  
}
.divQRCode{
    width: 100px;
    margin-left: 5%;
    align-content: center;
    justify-content: center;
    text-align: center;
}
.divMsgAddFriend {
    color: #ffffff;
    font-size: 10pt;
}
.qr-addfriend {
    width: 70px;
    border-radius: 5px;
}


@media only screen and (min-width: 320px)  {
    /*Grid - For Mobile S : ms */
    .hilight-message-cover {
 
        top: 360px;
        width: 95%;
        padding-left: 20px;
    }

}
@media only screen and (min-width: 375px)  {
     /* For Mobile M : mm */
     .hilight-message-cover {
 
        top: 360px;
        width: 95%;
        padding-left: 20px;
    }
 

}
@media only screen and (min-width: 425px) {
    /* For Mobile L : ml */
    .hilight-message-cover {
 
        top: 360px;
        width: 405px;
        padding-left: 30px;
    }
 
}

@media only screen and (min-width: 640px) {
    /* For Tablet widht 640: tm */
    .hilight-message-cover {
        top: 380px;
        width: 620px;
        padding-left: 30px;
    }
    .divAddFriend-container{
        margin-left: 0px;
        margin-top: 90px;
    }
}
@media only screen and (min-width: 768px) {
    /* For Tablet: t,tl */
    .hilight-message-cover {
        top: 380px;
        width: 740px;
        padding-left: 30px;
    }
    .divAddFriend-container{
        margin-left: 0px;
        margin-top: 80px;
    }
    .hilight-message-border {
        background:none;
        padding: 10px;
        border-radius: 10px;
    }
 
}
@media only screen and (min-width: 1024px) {
    /* For Laptop: ls */
    .hilight-message-cover {
        top: 380px;
        width: 550px;
        padding-left: 30px;
        color: #000000;
    }
    .divAddFriend-container{
        margin-left: -15px;
        margin-top: 80px;
    }
    .hilight-message-border {
        background:none;
        padding: 10px;
        border-radius: 10px;
    }
    .qr-addfriend {
        width: 90px;
        border-radius: 5px;
    }
    .divMsgAddFriend {
        color: #ffffff;
        font-size: 14pt;
        padding-left: 10px;
    }
 
 
}
@media only screen and (min-width: 1280px) {
    /* For Laptop  width 1280 px : lm*/
    .hilight-message-cover {
        top: 380px;
        width: 550px;
        padding-left: 30px;
        color: #000000;
    }
    .hilight-message-cover-desc {
        font-size: 16px;
        margin-top: 10px;
    }
 
}
@media only screen and (min-width: 1440px) {
    /* For Laptop L: ll */
    .divAddFriend-container {
        margin-left: 0px;
        margin-top: 80px;
    }
    .hilight-message-cover {
        top: 500px;
        width: 800px;
        padding-left: 60px;
        color: #000000;
    }
    .hilight-message-cover-desc {
        font-size: 16px;
        margin-top: 10px;
    }

}


.menuFixed {
 
    z-index: 1000;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
  
 
    height: 65px;
    background-color: rgba(229, 186, 196, .8);
 
}

.Message3 {
    margin-top: 70px;
    margin-left: 10%;
    font-size: 10pt;
    color: #090909;
    width: 320px;
}




/*
.divTitleName 
ดูใน flower-first.css
*/
#divTitleName {
    /* margin: auto; */
    text-align: center;
    color:#ffffff;
}


 

.hilightMessage {
    /* margin-left: 5%; */
    margin-top: 100px;
    text-align: center;
    background: rgba(170, 166, 153, 70%);
    padding: 50px;
}

.hilightMessage2{
  /*   margin-left: 5%;
    margin-top: 50px; */
}
.hilightMessageTitle{
    font-family:Pattaya;
    font-size:30px;
}
 
.hilightMessageDesc{
    font-family:Pattaya; 
    font-size:20px;
    margin-top:10px;
}
.divLineOA{
    font-family:  'Taviraj','Trirong','Pridi',serif,sans-serif, Sarabun;
    font-size:20px;
}
.divLineOA2{
    font-weight: bold;
}
.divAddFriend{
    margin-top: 10px;
}
.menuContainer{
    /* background-color: rgba(56, 44, 61, 1); */
    height: 100px;
    margin-bottom: 0px;
   
    position: relative;
    margin-left: 5%;

    display: flex;
    justify-content: flex-start;
    align-content: flex-start;

}
.menuContainer2{
    /* background-color: rgba(56, 44, 61, 1); */
    height: 100px;
    margin-bottom: 0px;
    /* position: relative; */
    display: flex;
    margin: 20px;
    align-content: center;
    justify-content: center;


}
.divMenu{
    display: flex;
    justify-content: flex-start;
    width: 300px;
    background-color: rgba(173, 167, 175 , 30%);
    padding: 10px;
    margin-bottom: -5px;
    margin-right: 10px;
    border-radius: 5px;

    -webkit-box-shadow: -2px 3px 13px -3px #000000; 
    box-shadow: 2px 3px 13px -8px #000000;

}
.divMenu2{
    display: flex;
    width: 300px;
    background-color: rgba(173, 167, 175, 30%);
    padding: 10px;
    /* margin-bottom: -5px; */
    /* margin-right: 10px; */
    border-radius: 5px;
    -webkit-box-shadow: -2px 3px 13px -3px #000000;
    box-shadow: 2px 3px 13px -8px #000000;


}
.divMenuQRCodeLabel{
    display: flex;
    justify-content: flex-start;
    width: 300px;
    background-color: rgba(173, 167, 175 , 30%);
    padding: 10px;
    padding-top: 15px;
    margin-top: 15px;
    margin-bottom: -5px;
    margin-right: 10px;
    border-radius: 5px;

    -webkit-box-shadow: -2px 3px 13px -3px #000000; 
    box-shadow: 2px 3px 13px -8px #000000;

}
.divMenuServiceTimeLabel{
    display: flex;
    justify-content: flex-start;
    width: 300px;
    background-color: rgba(173, 167, 175 , 30%);
    padding: 10px;
    padding-top: 15px;
    margin-top: 15px;
    margin-bottom: -5px;
    margin-right: 10px ;
    border-radius: 5px;

    -webkit-box-shadow: -2px 3px 13px -3px #000000; 
    box-shadow: 2px 3px 13px -8px #000000;
}


.imgQRCode{
    width: 80%;
}

 
 
.divCalendar{
    width: 120px;
    align-content: center;
    justify-content: center;
    text-align: center;
}
.imgCalendar{
    width: 90px;
}


.topbar {
    background-color: rgb(0 0 0 / 70%); 
    position: absolute;
    z-index: 5;
    width: 100%;
    height: 140px;
    color: #ffffff;
    top: 60px;
    text-align: center;
}
.topbar-msg-title2 {
    font-family: Italianno, cursive;
    font-size: 36px;
    font-weight: normal;
    display: block;
    color: #ffdf8d;
    padding-top: 10px;
}
.topbar-msg-title {
    font-family: Italianno, cursive;
    font-size: 36px;
    font-weight: normal;
    display: block;
    color: #ffffff;
    padding-top: 10px;
}
.time-info{

}
.time-info-label{
    color: #ffffff;
}
.topbar-msg-desc {
    margin-top: -10px;
    display: block;
    font-size: 12pt;
}


.divLogoHomepage {
    padding-bottom: 20px;
}
.div-article-title {
    color: #000000;
    padding: 20px;
    font-family: pattaya;
    font-size: 1.2rem;
    background: url(../images/article/menu.png) center;
    background-size: contain;
    background-repeat: no-repeat;
}
.h1-homepage {
    font-size: 24px;
    margin-top: 10px;
    margin: 20px;
    font-family: "Taviraj", "Trirong", "Pridi", serif, sans-serif, Sarabun;
    font-weight: bold;
    color: #977b2a;
}
.titleweb-homepage {
    font-family: Italianno, cursive;
    font-size: 28pt;
    text-align: center;
    color: #ffffff;
}

.wreath-hilight{
 
    /* width: 100%; */
    /* height: auto; */
    display: block;
    position: absolute;
    top: 100px;
 
  
}
.hilightMessage-homepage {
    /* margin-left: 5%; */
    /* margin-top: 170px; */
  /*   padding-top: 300px; */
    color: rgba(255, 255, 255, .9);
    text-align: center;
}
.hilightMessageDesc-homepage {
    font-family: Pattaya;
 
    margin-top: 10px;
    text-align: center;
    color: #ffffff;
}
.divLineOA-homepage {
    /* color: #80692e; */
    /* color:#ffdf8d; */
    font-family: 'Taviraj', 'Trirong', 'Pridi', serif, sans-serif, Sarabun;
    font-size: 20px;
}
.button-container {
    display: inline;
    margin: 5px;
}
.divAddFriend-homepage {
    margin-top: 10px;
}
div#divMenuTime1 {
    color: rgba(255, 255, 255, 1);
    /* margin-left: 5%; */
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
}


/* divTitleName ชื่อเว็บ (ตัวใหญ่ๆ)*/
#divTitleName[data-id="divTitleName"]{
    font-family: Italianno, cursive;
    font-size: 120px;
    font-weight: normal;
    position: relative;
    top: 90px;
    margin-left: 5%;
}


@keyframes titlewebmove {
    0%   { color: #000000;}
    25%  { color: #4c3909;}
    50%  { color: #7e6320;}
    75%  { color: #bda976;}
    100% { color:  #fff1cd;}
  }

.title-container {
    display: flex;
    flex-wrap: nowrap;
    align-content: flex-start;
    justify-content: flex-start;
    align-items: flex-start;
}
.titleweb {
    /* padding-left: 10px; */
    display: inline-block; 
    font-family: Pattaya;
    margin-left: 5%;
    vertical-align: top;
    /* text-align: center; */
    /* align-content: center; */
    /* height: 50px; */
    font-size: 30pt;
    margin-top: 5px;  
    
    font-weight: normal;
    padding-right: 10px;
    text-wrap: nowrap;
    color: #000000;
    display: none;
}
  
 
.titleweb2 {
     
    padding-left: 10px;
    display: inline-block;
    font-family: Italianno;
    vertical-align: middle;
    text-align: center;
    align-content: center;
     height: 50px;  
    margin-top: -5px;
    
}  
.contact{
    display: none;
} 
@media only screen and (min-width: 320px)  {
    /*Grid - For Mobile S : ms */
    .divImageItem {
        width: 90%;
         
    }
    .imageModalContent {
        width: 300px;
    }
    .divLastDelivery {
        width:96%;
    }
    .divLastDeliveryListItem {width: 96%;}
 
    /* เวลาทำการ */
    #divMenuTime1[data-id="divMenuTime1"]{
        display: block;
       
    }
    #divMenuTime2[data-id="divMenuTime2"]{
        display:none;
    }

    /* divTitleName ชื่อเว็บ (ตัวใหญ่ๆ)*/
    #divTitleName[data-id="divTitleName"]{
        font-family: Italianno, cursive;
        font-size: 60px;
        font-weight: normal;
        position: relative;
        top: 90px;
        margin-left: 5%;
    }
    .titleweb{
        font-size: 16px;
    }
    .titleweb2{
        font-size: 36px;
    }
    .contact{
        display: none;
    } 

}
@media only screen and (min-width: 375px)  {
     /* For Mobile M : mm */
     .divImageItem {
        width: 90%;
        
    }
    .imageModalContent {
        width: 325px;
    }
    .divLastDelivery {
        width:96%;
    }
    .divLastDeliveryListItem {width: 96%;}

    /* เวลาทำการ */
    #divMenuTime1[data-id="divMenuTime1"]{
        display: block;
        
    }
    #divMenuTime2[data-id="divMenuTime2"]{
        display:none;
    }
    /* divTitleName ชื่อเว็บ (ตัวใหญ่ๆ)*/
    #divTitleName[data-id="divTitleName"]{
        font-family: Italianno, cursive;
        font-size: 60px;
        font-weight: normal;
        position: relative;
        top: 90px;
        margin-left: 5%;
    }
    .titleweb{
        font-size: 16px;
    }
    .titleweb2{
        font-size: 36px;
    }
    .contact{
        display: none;
    } 

}
@media only screen and (min-width: 425px) {
    /* For Mobile L : ml */
    .divImageItem {
        width: 45%;
        
    }
    .imageModalContent {
        width: 400px;
    }
    .divLastDelivery {
        width:96%;
    }
    .divLastDeliveryListItem {width: 96%;}
 
    /* เวลาทำการ */
    #divMenuTime1[data-id="divMenuTime1"]{
        display: block;
       
    }
    #divMenuTime2[data-id="divMenuTime2"]{
        display:none;
    }
    /* divTitleName ชื่อเว็บ (ตัวใหญ่ๆ)*/
    #divTitleName[data-id="divTitleName"]{
        font-family: Italianno, cursive;
        font-size: 80px;
        font-weight: normal;
        position: relative;
        top: 90px;
        margin-left: 5%;
    }

    .titleweb{
        font-size: 20px;
    }
    .titleweb2{
        font-size: 40px;
    }
    .contact{
        display: none;
    } 

}

@media only screen and (min-width: 640px) {
    /* For Tablet widht 640: tm */
    .divImageItem {
        width: 45%;
         
    }
    .imageModalContent {
        width: 450px;
    }
    .divLastDelivery {
        width:45%;
    }
    .divLastDeliveryListItem {width: 96%;}
 
    /* เวลาทำการ */
    #divMenuTime1[data-id="divMenuTime1"]{
        
        display: block;
        
    }
    #divMenuTime2[data-id="divMenuTime2"]{
        display: flex;
        justify-content: flex-start;

    }
    /* divTitleName ชื่อเว็บ (ตัวใหญ่ๆ)*/
    #divTitleName[data-id="divTitleName"]{
        font-family: Italianno, cursive;
        font-size: 100px;
        font-weight: normal;
        position: relative;
        top: 90px;
        margin-left: 5%;
    }
    .titleweb{
         font-size: 20px;
     }
    .titleweb2{
        font-size: 40px;
    }
    .contact {
        display: block;
        justify-content: flex-end;
        padding-right: 1rem;
        text-align: right;
        position: relative;
        top: -.5rem;
    }

}
@media only screen and (min-width: 768px) {
    /* For Tablet: t,tl */
    .divImageItem {
        width: 45%;
        
    }
    .imageModalContent {
        width: 450px;
    }
    .divLastDelivery {
        width:45%;
    }
    .divLastDeliveryListItem {width: 96%;}

    /* เวลาทำการ */
    #divMenuTime1[data-id="divMenuTime1"]{
    
        display: block;
        
    }
    #divMenuTime2[data-id="divMenuTime2"]{
        display: flex;
        justify-content: flex-start;

    }
    /* divTitleName ชื่อเว็บ (ตัวใหญ่ๆ)*/
    #divTitleName[data-id="divTitleName"]{
        font-family: Italianno, cursive;
        font-size: 120px;
        font-weight: normal;
        position: relative;
        top: 90px;
        margin-left: 5%;
    }

    .titleweb{
        font-size: 20px;
    }
    .titleweb2{
        font-size: 40px;
    }
    .contact {
        display: block;
        justify-content: flex-end;
        padding-right: 1rem;
        text-align: right;
        position: relative;
        top: -.5rem;
    }


}
@media only screen and (min-width: 1024px) {
    /* For Laptop: ls */
    .divImageItem {
        width: 45%;
         
    }
    .imageModalContent {
        width: 450px;
    }
    .divLastDelivery {
        width:45%;
    }
    .divLastDeliveryListItem {width: 45%;}
 
    /* เวลาทำการ */
    #divMenuTime1[data-id="divMenuTime1"]{
        
        display: block;
        
    }
    #divMenuTime2[data-id="divMenuTime2"]{
        display: flex;
        justify-content: flex-start;

    }
    /* divTitleName ชื่อเว็บ (ตัวใหญ่ๆ)*/
    #divTitleName[data-id="divTitleName"]{
        font-family: Italianno, cursive;
        font-size: 120px;
        font-weight: normal;
        position: relative;
        top: 90px;
        margin-left: 5%;
    }

    .titleweb{
        font-size: 24px;
    }
    .titleweb2{
        font-size: 40px;
    }
    .contact {
        display: block;
        justify-content: flex-end;
        padding-right: 1rem;
        text-align: right;
        position: relative;
        top: -.5rem;
    }

}
@media only screen and (min-width: 1280px) {
    /* For Laptop  width 1280 px : lm*/
    .divImageItem {
        width: 32%;
         
    }
    .imageModalContent {
        width: 450px;
    }
    .divLastDelivery {
        width:45%;
    }
    .divLastDeliveryListItem {width: 45%;}
 
    /* เวลาทำการ */
    #divMenuTime1[data-id="divMenuTime1"]{
        
        display: block;
        
    }
    #divMenuTime2[data-id="divMenuTime2"]{
        display: flex;
        justify-content: flex-start;

    }
    /* divTitleName ชื่อเว็บ (ตัวใหญ่ๆ)*/
    #divTitleName[data-id="divTitleName"]{
        font-family: Italianno, cursive;
        font-size: 120px;
        font-weight: normal;
        position: relative;
        top: 90px;
        margin-left: 5%;
    }
    .titleweb{
        font-size: 24px;
    }
    .titleweb2{
        font-size: 40px;
    }
    .contact {
        display: block;
        justify-content: flex-end;
        padding-right: 1rem;
        text-align: right;
        position: relative;
        top: -.5rem;
    }

}
@media only screen and (min-width: 1440px) {
    /* For Laptop L: ll */
    .divImageItem {
        width: 32%;
         
    }
    .imageModalContent {
        width: 450px;
    }
    .divLastDelivery {
        width:45%;
    }
    .divLastDeliveryListItem {width: 45%;}
 
    /* เวลาทำการ */
    #divMenuTime1[data-id="divMenuTime1"]{
        
        display: block;
        
    }
    #divMenuTime2[data-id="divMenuTime2"]{
        display: flex;
        justify-content: flex-start;

    }
    /* divTitleName ชื่อเว็บ (ตัวใหญ่ๆ)*/
    #divTitleName[data-id="divTitleName"]{
        font-family: Italianno, cursive;
        font-size: 120px;
        font-weight: normal;
        position: relative;
        top: 90px;
        margin-left: 5%;
    }

    .titleweb{
        font-size: 24px;
    }
    .titleweb2{
        font-size: 40px;
    }
    .contact {
        display: block;
        justify-content: flex-end;
        padding-right: 1rem;
        text-align: right;
        position: relative;
        top: -.5rem;
    }

}
/* ********************
        menu
******************** */

/* decoration ของเมนู ในหน้าปัจจุบัน*/
.page-active {
    /* background-color: rgba(171, 167, 161, .8); */
    border-radius: 5px;
    /* color: #ffffff; */
    height: 40px;
    display: flex;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    padding: 10px;
}
 


/* override bootstrap*/
.navbar-collapse.show{
    /* background-color: rgba(125, 94, 7, .8); */
    padding: 5px;
    border-radius: 5px;
    background: #d7d5d7;
    margin-top: 18px;
}
.navbar-collapse>div.divQRCodeMenu{
    display: none;
}
.navbar-collapse>div.divLineOAMenu{
    display: none;
}
.navbar-collapse>div.divWebsiteMenu{
    display: none;
}
.navbar-collapse>div.divWebsiteMenu2{
    display: none;
}
.navbar-collapse>div.divLineOATextOnMenu {
    display: none;

}


.navbar-collapse.show>div.divQRCodeMenu {
    display: flex;
    justify-content: center;
 
}
.navbar-collapse.show>div.divLineOAMenu {
    display: flex;
    justify-content: center;
    margin-top: 15px;
    margin-bottom: -10px;
    color: #4c3b0b;
}

.navbar-collapse.show>div.divWebsiteMenu {
    display: block;
    font-family: Italianno;
    font-weight: normal;
    position: relative;
    /* top: 80px; */
    /* margin-left: 5%; */
    color: rgb(83 63 70);
    font-size: 35pt;
    text-align: center;
    margin-bottom: 0px;
    margin-top: -15px;
}
.navbar-collapse.show>div.divWebsiteMenu2 {
    display: block;
    font-family: Pattaya;
    font-weight: normal;
    position: relative;
    /* top: 80px; */
    /* margin-left: 5%; */
    color: rgb(83 63 70);
    font-size: 16pt;
    text-align: center;
    margin-top: 20px;
}

.navbar-collapse.show>div.divLineOATextOnMenu {
    display: block;
    padding: 10px;
    color:#786355;
}
.navbar-collapse.show>div.divLineOATextOnMenu2 {
    display: none;
}


/*overrides bootstrap*/
.navbar-collapse.show>ul.navbar-nav>li.nav-item {
    /* background-color: rgb(64 63 61 / 100%); */
    /* background-color: rgb(90 67 21); */
     margin: 1px;
    border-radius: 5px;
}
.navbar-collapse.show>ul.navbar-nav>li.nav-item-bg {

    /* background-color: rgba(171, 167, 161, .8); */
    color: #4c3b0b;

}
.nav-item-backgroud{
    background-color: rgba(171, 167, 161, .8);
    /* background: linear-gradient(270deg, rgba(125, 94, 7, 1) -10.74%, #b28d27 20.74%, #bf9c3d 50.25%, rgb(157 123 27) 80.49%, #c29f3f 99%);
 */
}



a.nav-link {
   
    color: #4c3b0b;
    background-color: rgba(171, 167, 161, .5);
    padding: 5px;
    margin: 2px;
    border-radius: 5px;
    text-align: center;
}
a.nav-link :hover{
    color: #e5e2dc;
}
/*overrides bootstrap*/
.navbar-collapse {
    flex-basis: 100%; 
    flex-grow:0; 
    align-items: center;
    padding-right: 2rem;
}
a.text-back-to-homepage{
    /* color: #dacfb2; */
}

/*overrides bootstrap*/
.mb-2 {
    margin-bottom: 0rem !important;
}



/**********************
/*      divAbout      */
/*********************/
div#divAbout {
    padding: 5px;
    padding-bottom: 20px;
    border-radius: 5px;
    background: #d7d5d7;
    margin-top: 18px;
    width: 300px;
    text-align: center;
    /* display: flex; */
    /* flex-direction: column; */
    align-content: center;
    justify-content: center;
    align-items: center;
    margin: auto;
    position: absolute;
    top: 70px;
    
}
div#divAbout,
div#divAbout-Container{
    display: none;
}
div#divAbout-Container {
    width: 100%;
    /* display: flex; */
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    position: fixed;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(18, 18, 18, .9);
    z-index:999999;
}

#divAbout>div.divWebsiteMenu2 {
    display: block;
    font-family: Pattaya;
    font-weight: normal;
    position: relative;
    /* top: 80px; */
    /* margin-left: 5%; */
    color: rgb(83 63 70);
    font-size: 16pt;
    text-align: center;
    margin-top: 35px;
}
#divAbout>div.divWebsiteMenu {
    display: block;
    font-family: Italianno;
    font-weight: normal;
    position: relative;
    /* top: 80px; */
    /* margin-left: 5%; */
    color: rgb(83 63 70);
    font-size: 35pt;
    text-align: center;
    margin-bottom: 0px;
    margin-top: -15px;
}

#divAbout>div.divLineOAMenu {
    padding-top: 10px;
}
.div-about-close {
    float: right;
    padding-right: 10px;
    font-family: sans-serif;  
    font-weight: bold;
}
.div-about-close:hover {
    cursor: pointer;
}

/* image line app ตอนกดดูเมนู จากจอมือถือ*/
img.line-app0 {
    width: 25px;
    margin: 5px;
}


img.line-app {
    width: 25px;
    margin: 5px;
}

img.line-app:hover{
    cursor: pointer;
}
