body{
    background-color: #FAFAFF !important;
}
@font-face {
    font-family: font_Roboto;
    src: url('asset/font/Roboto/Roboto-Regular.ttf');
}
@font-face {
    font-family: font_Roboto_Medium;
    src: url('asset/font/Roboto/Roboto-Medium.ttf');
}
@font-face {
    font-family: font_Roboto_Bold;
    src: url('asset/font/Roboto/Roboto-Bold.ttf');
}
@font-face {
    font-family: font_Roboto-Light;
    src: url('asset/font/Roboto/Roboto-Light.ttf');
}
@font-face {
    font-family: font_Roboto_Regular;
    src: url('asset/font/Roboto/Roboto-Regular.ttf');
}
@font-face {
    font-family: font_THSarabunNew;
    src: url('asset/font/THSarabunNew/THSarabunNew Bold.ttf');
}
@font-face {
    font-family: font_sarabun_light;
    src: url('asset/font/Sarabun/Sarabun-Light.ttf');
}
@font-face {
    font-family: font_sarabun_regular;
    src: url('asset/font/Sarabun/Sarabun-Regular.ttf');
}
@font-face {
    font-family: font_sarabun_Medium;
    src: url('asset/font/Sarabun/Sarabun-Medium.ttf');
}
@font-face {
    font-family: font_sarabun_SemiBold;
    src: url('asset/font/Sarabun/Sarabun-SemiBold.ttf');
}
@font-face {
    font-family: font_sarabun_Bold;
    src: url('asset/font/Sarabun/Sarabun-Bold.ttf');
}
@font-face {
    font-family: font_SukhumvitSet_Medium;
    src: url('asset/font/SukhumvitSet/SukhumvitSet-Medium.ttf');
}
@font-face {
    font-family: font_SukhumvitSet_SemiBold;
    src: url('asset/font/SukhumvitSet/SukhumvitSet-SemiBold.ttf');
}
@font-face {
    font-family: font_SukhumvitSet_Bold;
    src: url('asset/font/SukhumvitSet/SukhumvitSet-Bold.ttf');
}
@font-face {
    font-family: Prompt-SemiBold;
    src: url('asset/font/prompt/Prompt-SemiBold.ttf');
}
@font-face {
    font-family: Prompt-Medium;
    src: url('asset/font/prompt/Prompt-Medium.ttf');
}
@font-face {
    font-family: Prompt-Light;
    src: url('asset/font/prompt/Prompt-Light.ttf');
}
@font-face {
    font-family: Kanit-Regular;
    src: url('asset/font/Kanit/Kanit-Regular.ttf');
}
@font-face {
    font-family: Kanit-Light;
    src: url('asset/font/Kanit/Kanit-Light.ttf');
}
@font-face {
    font-family: font_SukhumvitSet_SemiBold;
    src: url('asset/font/SukhumvitSet/SukhumvitSet-SemiBold.ttf');
}
@font-face {
    font-family: font_SukhumvitSet_Medium;
    src: url('asset/font/SukhumvitSet/SukhumvitSet-Medium.ttf');
}
@font-face {
    font-family: font_SukhumvitSet_Text;
    src: url('asset/font/SukhumvitSet/SukhumvitSet-Text.ttf');
}

h5{
    text-decoration: none !important;
}
a{
    text-decoration: none !important;
}

.ro-m{
    font-family: font_Roboto_Medium;
}
.ro-l{
    font-family: font_Roboto-Light;
}
.font-sarabun_me{
    font-family: font_sarabun_Medium;
    font-size: 20px;
    color: #193B68;
}
.font-sarabun_re{
    font-family: font_sarabun_regular;
    font-size: 16px;
    color: #193B68;
}
.font-sarabun_bold{
    font-family: font_sarabun_Bold;
    font-size: 25px;
    color: #193B68;
}
.font-sarabun_light{
    font-family: font_sarabun_light;
    font-size: 16px;
    color: #193B68 !important;
}
.font_nev{
	 font-family: font_sarabun_regular;
}
.font_drop{
     font-family: Prompt-Medium;
}
.button_banner{
	font-family: font_sarabun_regular;
	font-size: 16px;
    width: 140px;
    background: rgba(41, 55, 104, 0.1);
    border: 2px solid #FFFFFF;
    box-sizing: border-box;
    box-shadow: 0px 4px 4px rgba(61, 97, 155, 0.2);
    border-radius: 6px;
}
.button_banner_white{
    font-family: font_sarabun_Medium;
    color: #2B4068 !important;
    width: 140px;
    font-size: 16px;
    background: #FFFFFF;
    box-shadow: 0px 4px 4px rgba(61, 97, 155, 0.2);
    border-radius: 6px;
    border:1.2px solid #ffffff; 
}
.fonth_ad{
	 font-family: font_sarabun_Medium; 
	 color: #4ECC88;
	 font-size: 18px;
}
.fonth_con{
	 font-family: font_sarabun_Regular; 
	 color: #43454E;
	 font-size: 14px;
}
/*body{
	background-color:#F6F8FA !important;
}*/
hr{
	margin-top:7px !important;
	margin-bottom:7px !important;
		color: #EFEFEF !important;
	border-top: 0.5px solid rgba(0,0,0,.1) !important;
}
.map{
    width:100%;
    height:250px;   
}
.gmap_canvas{
    width:100%;
    height:250px;   
}
.leg{
  display:none;
}
.yai{
  display:block;
}
.hover-feature:hover {
    margin-top: -20px !important;
    box-shadow: 0px 5px 50px rgba(142, 109, 246, 0.25) !important;
    transition: 0.2s;
}
.nav-item .active{
  color: #1479FF !important;
  font-family: font_sarabun_SemiBold;
}
.nav-item .active_green{
  color: #B0E26A !important;
  font-family: font_sarabun_SemiBold;
}
.dropdown-menu :hover{
    background-color: #B0E26A !important;
}

.card{
    padding: 15px 25px 25px 25px; 
    width: 300px;
    height: 300px;
    border:0.7px solid #ffffff !important;
    background: #FFFFFF !important;
    box-shadow: 0px 6px 50px rgba(0, 0, 0, 0.03) !important;
    border-radius: 6px;
}
.button_contact{
  height: 40px;
  background-color: #2B4068; /* For browsers that do not support gradients */
  border-radius: 5px;
  box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);
}
.button_cancel{
  height: 40px;
  background-color:  #EDEDED; /* For browsers that do not support gradients */
  border-radius: 5px;
  box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);
}
.place{
    font-family: font_sarabun_regular;
}

    .card-leg{
        display:none;
    }
    .card-medium{
display:none;
    }
    .card-yai{
display:block;
    }

@media only screen and (max-width: 1400px){
    .card-leg{
        display:none;
    }
    .card-medium{
display:block;
    }
    .card-yai{
display:none;
    }
    .leg{
  display:none;
    }
  .yai{
  display:block;
  }
    }
@media only screen and (max-width: 768px){
    .card-leg{
        display:block;
    }
    .card-medium{
display:none;
    }
    .card-yai{
display:none;
    }
  .leg{
  display:block;
}
  .yai{
  display:none;
}
}


--------------------------------------navbar-----------------------------------



    @media (min-width: 800px) and (max-width: 850px) {
            .navbar:not(.top-nav-collapse) {
                background: linear-gradient(110deg, #fdcd3b 20%, #ffaa00 60%) !important;
            }
            
        }

.carousel,.carousel .carousel-inner,.carousel .carousel-inner .active,.carousel .carousel-inner .carousel-item,.view,body,html{
    height:100%
}

.navbar{
    background-color:rgba(0,0,0,0);
    box-shadow: none;
}

.navbar.scrolling-navbar.top-nav-collapse {
    padding-top: 10px;
    padding-bottom: 10px;
}
.page-footer,.top-nav-collapse{
    /*background: linear-gradient(110deg, #fdcd3b 20%, #ffaa00 60%);*/
    background-color: white;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05);
}

.indent-50{
    text-indent: 50px;
}

.text-headpage{
    color:#fa0;
}

.page-footer{
    background: linear-gradient(110deg, #ffaa00 80%, #fdcd3b 60%);
}

.navbar.navbar-dark .navbar-nav .nav-item.active>.nav-link{
    background-color: rgba(255, 255, 255, 0.5);
    color:black;
}

.hoverimage{
    max-width:100px;
    margin:15px 15px 0px 15px;
    transition: .3s;
}

.hoverimage:hover{
    max-width:120px;
    transition: .3s;
}



@media only screen and (max-width: 1200px){
    .table-responsive-xl {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .navbar{
            background-color:white !important;
            }
}