@charset "utf-8";
/* CSS Document */
body
{
	font-family: 'Sarabun', sans-serif;
	font-size: 14px;
}
.nav-link, .card-header, .navbar-brand, marquee
{
	font-family: 'Trirong', serif;
	font-weight: 600;
	font-size: 14px;
}
.list-group-item
{
	font-family: 'Trirong', serif;
	font-weight: 500;
	font-size: 14px;
}
.hd-font
{
	font-family: 'Trirong', serif;
	font-weight: 600;
	font-size: 15px;
}
.img-100 { width: 100% }

@media (min-width: 1400px) {
.container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1240px; }
.l-menu { padding-right: 0; }
.r-menu { padding-left: 0 !important }
}

@media (min-width: 992px) {
.navbar-expand-md .navbar-nav .nav-link
{
	padding-right: .5rem;
	padding-left: .5rem;
}
}

@media (max-width: 991px) {
.container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 100%; }
.navbar-expand-md .navbar-nav .nav-link
{
	padding-right: .3rem;
	padding-left: .3rem;
	font-size: 13px;
}
.shadow-sm { box-shadow: none !important }
}

@media (min-width: 768px) {
object, .card-body iframe { min-height: 1000px; }
.m-menu-bot { display: none }
}

@media (max-width: 767px) {
.l-menu, .r-menu { display: none !important }
.m-menu-bot { display: inline-block !important }
.m-menu-bot .card { margin-bottom: 1rem }
object, .card-body iframe { min-height: 100px; }
.navbar-expand-md .navbar-nav .nav-link
{
	padding-right: .25rem;
	padding-left: .25rem;
}
.navbar
{
	position: fixed;
	top: 8px;
	right: 0;
	z-index: 900;
	background: none;
	border: 0 !important;
	box-shadow: none
}
.navbar-brand { display: none }
.bg-white
{
	background: none !important;
	background-color: none !important
}
}

@media (min-width: 576px) {
.l-menu { padding-right: 0; }
.r-menu { padding-left: 0 }
}
.l-menu .card-header, .r-menu .card-header, .r-menu .list-group-item, .l-menu .list-group-item { padding: .35rem .55rem; }
.l-menu .card, .r-menu .card
{
	margin-bottom: 15px;
	border: none;
	border-radius: 0;
}
.l-menu .card .card-header, .r-menu .card .card-header, .m-menu-bot .card .card-header
{
	text-align: center;
	font-weight: 600;
	background: #117b18;
	color: white;
}
.card { border-radius: 0; }
html { min-height: 100%; }
body
{
	min-height: 100%;
	background-image: linear-gradient(#1a7cf5, #ffffff);
	background-repeat: no-repeat;
	background-size: cover;
}
a { text-decoration: none !important; }
.w-50 {
width:50px !important;
}
.carousel-fade .carousel-item
{
	opacity: 0;
	transition-duration: .6s;
	transition-property: opacity;
}
.carousel-fade .carousel-item.active, .carousel-fade .carousel-item-next.carousel-item-left, .carousel-fade .carousel-item-prev.carousel-item-right { opacity: 1; }
.carousel-fade .active.carousel-item-left, .carousel-fade .active.carousel-item-right { opacity: 0; }
.carousel-fade .carousel-item-next, .carousel-fade .carousel-item-prev, .carousel-fade .carousel-item.active, .carousel-fade .active.carousel-item-left, .carousel-fade .active.carousel-item-prev
{
	transform: translateX(0);
	transform: translate3d(0, 0, 0);
}
.btn-admin
{
	font-size: 10px;
	padding: 2px;
}
a { text-decoration: none; }
.card-header:first-child, .btn { border-radius: 0 !important; }
hr
{
	margin-top: 1rem;
	margin-bottom: 1rem;
	border: 0;
	border-top: 1px dashed rgba(0,0,0,.1);
}
.navbar-light .navbar-nav .nav-link, .navbar-brand { color: #ffffff !important; }
.bg-white
{
	background-image: linear-gradient( 171deg, #1a7cf5, #6CD7F8);
	background-repeat: no-repeat;
	background-size: cover;
}
.bg-none { background: none !important }
.bd-none { border: none !important }
.form-control
{
	display: block;
	width: 100%;
	height: calc(1.5em + .75rem + 2px);
	padding: .375rem .75rem;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #495057;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	border-radius: 0;
	transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.list-group-item:hover
{
	background: #0592c9;
	cursor: pointer;
	color: white !important;
	background-image: linear-gradient( 360deg, #0592c9, #f9f3f380);
	background-repeat: no-repeat;
	background-size: cover;
}
#app>.container
{
	background: #FFFFFF;
	background-image: linear-gradient( 360deg, #0592c9, #f9f3f380);
	background-repeat: no-repeat;
	background-size: cover;
}
.pd-0
{
	padding: 0 !important;
	margin-bottom: 5px;
}
.sidenav
{
	height: 100%;
	width: 0;
	position: fixed;
	z-index: 16;
	top: 0;
	left: 0;
	background-color: #1a7cf5 !important;
	background-image: linear-gradient( 113deg, #ffffff00, #f9f3f39e);
	background-repeat: no-repeat;
	background-size: cover;
	overflow-x: hidden;
	transition: 0.5s;
	padding-top: 60px;
}
.sidenav a
{
	padding: 8px 8px 8px 32px;
	text-decoration: none;
	color: white;
	display: block;
	transition: 0.3s;
}
.sidenav .dropdown-menu a
{
	color: #1E6AF0;
	font-family: 'Trirong', serif;
	font-weight: 500;
	font-size: 14px;
}
.sidenav a:focus { color: red; }
.sidenav a:hover { color: #f1f1f1; }
.sidenav .closebtn
{
	position: absolute;
	top: 0;
	right: 25px;
	font-size: 36px;
	margin-left: 50px;
}

@media screen and (max-height: 450px) {
.sidenav { padding-top: 15px; }
.sidenav a { font-size: 18px; }
}
.l-menu .card , .r-menu .card , .col-md-8 .card{
	
-webkit-box-shadow: 0px 3px 4px 2px rgba(155,201,250,1);
-moz-box-shadow: 0px 3px 4px 2px rgba(155,201,250,1);
box-shadow: 0px 3px 4px 2px rgba(155,201,250,1);

}