﻿@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300&display=swap');
body 
{
	
	margin-top:0;margin-right:0;margin-left:0;margin-bottom:0;
	font-weight:normal; font-family:'Kanit', serif;font-size:14px; color: #000000;
	
	/* background-color: #fff;*/
}

.google8 { font-weight:normal; font-family: 'Kanit', sans-serif; color:#2e302e; font-size:8px; }
.google10 { font-weight:normal; font-family: 'Kanit', sans-serif; color:#2e302e; font-size:10px; }
.google12 { font-weight:normal; font-family: 'Kanit', sans-serif; color:#2e302e; font-size:12px; }
.google14 { font-weight:normal; font-family: 'Kanit', sans-serif; color:#000;font-size:14px; }
.google16 { font-weight:normal; font-family: 'Kanit', sans-serif;font-size:16px; }
.google18 { font-weight:normal; font-family: 'Kanit', sans-serif;font-size:18px; }
.google20 { font-weight:normal; font-family: 'Kanit', sans-serif;font-size:20px; }
.google22 { font-weight:normal; font-family: 'Kanit', sans-serif;font-size:22px; }
.google24 { font-weight:normal; font-family: 'Kanit', sans-serif;font-size:24px; }
.google26 { font-weight:normal; font-family: 'Kanit', sans-serif;font-size:26px; }
.google28 { font-weight:normal; font-family: 'Kanit', sans-serif;font-size:28px; }
.google30 { font-weight:normal; font-family: 'Kanit', sans-serif;font-size:30px; }
.google24B { font-weight: bold; font-family: 'Kanit', sans-serif;font-size:24px; }

.Verdana14 { font-weight:normal; font-family: 'Verdana', sans-serif;font-size:14px; }
.Verdana16 { font-weight:normal; font-family: 'Verdana', sans-serif;font-size:16px; }
.Verdana18 { font-weight:normal; font-family: 'Verdana', sans-serif;font-size:18px; }
.Verdana20 { font-weight:normal; font-family: 'Verdana', sans-serif;font-size:20px; }





 .gutter-8.row {
        margin-right: -4px;
        margin-left: -4px;
      }
      .gutter-8 > [class^="col-"], .gutter-8 > [class^=" col-"] {
        padding-right: 4px;
        padding-left: 4px;
      }

      .gutter-4.row {
        margin-right: -2px;
        margin-left: -2px;
      }
      .gutter-4 > [class^="col-"], .gutter-4 > [class^=" col-"] {
        padding-right: 2px;
        padding-left: 2px;
      }



 .ajax__calendar_container { z-index : 1000 ; }
       .ajax__calendar {
        position: relative;
        left: 0px !important;
        top: 0px !important;
        visibility: visible; display: block;
    }
    .ajax__calendar iframe
    {
        left: 0px !important;
        top: 0px !important;
    }


 .ajax__colorPicker_container { z-index : 1000 ; }
       .ajax__colorPicker {
        position: relative;
        left: 0px !important;
        top: 0px !important;
        visibility: visible; display: block;
    }
    .ajax__colorPicker iframe
    {
        left: 0px !important;
        top: 0px !important;
    }


 .ajax__AutoComplete_container { z-index : 1000 ; }
       .ajax__AutoComplete {
        position: relative;
        left: 0px !important;
        top: 0px !important;
        visibility: visible; display: block;
    }
    .ajax__AutoComplete iframe
    {
        left: 0px !important;
        top: 0px !important;
    }




.topline
{
	border-bottom-width: 1px;
	border-bottom-style: solid;	
	border-bottom-color: #ccc;
	
}



.mGrid {background-color:transparent;  margin: 2px 0 5px 0; border: solid 1px #60bff0; border-collapse:collapse;  }
    .mGrid td { padding: 2px; border: solid 1px #f4f4f4; text-align: left; color: #a3a4a3; font-weight:lighter; font-family: 'Prompt', sans-serif;font-size:12px;}
    .mGrid th { padding: 5px 2px; color: #000;text-align: center; background: #b5def3 url('css/grd_head.png') repeat-x top; border-left: solid 1px #60bff0; font-weight:lighter; font-family: 'Prompt', sans-serif;font-size:12px; }
.mGrid .alt { background: #fcfcfc url('css/grd_alt.png') repeat-x top;  }
.mGrid .pgr {background: #b5def3 url('css/grd_pgr.png') repeat-x top; }
    .mGrid .pgr table { margin: 2px 0; }
    .mGrid .pgr td { border-width: 0; padding: 0 0px; border-left: solid 0px #666; font-weight: normal; color: #fff; line-height: 12px;  }   
    .mGrid .pgr a { color: #666; text-decoration: none; }
    .mGrid .pgr a:hover { color: #ed931f; text-decoration: none; }
    
    
    
     .mGrid1 {background-color: Transparent;  margin: 2px 0 5px 0;  border: solid 0px #f4f4f4; border-collapse:collapse;
    font-weight: 700;
}
    .mGrid1 td { padding: 5px; border-top: solid 1px #e3f1f6; border-bottom: solid 1px #e3f1f6;  color: #000; font-weight:lighter; font-family: 'Prompt', sans-serif;font-size:12px;}
    .mGrid1 th { padding: 5px 2px; color: #000; text-align: center; border-left: solid 0px #f4f4f4; font-weight:lighter; font-family: 'Kanit', sans-serif;font-size:14px; }
.mGrid1 .alt { background: #fcfcfc url('css/grd_alt.png') repeat-x top;  }
.mGrid1 .pgr {background: #b5def3 url('css/grd_pgr.png') repeat-x top; }
    .mGrid1 .pgr table { margin: 5px 0; }
    .mGrid1 .pgr td { border-width: 0; padding: 0 0px; border-left: solid 0px #666; font-weight: normal; color: #fff; line-height: 12px;  }   
    .mGrid1 .pgr a { color: #666; text-decoration: none; }
    .mGrid1 .pgr a:hover { color: #ed931f; text-decoration: none; }    
    
    
    .mGrid2 {background-color: #fff;  margin: 2px 0 5px 0;  border: solid 0px #f4f4f4; border-collapse:collapse;  }
    .mGrid2 td { padding: 2px; border: solid 1px #f4f4f4;  color: #000; font-weight:lighter; font-family: 'Tahoma', sans-serif;font-size:14px;}
    .mGrid2 th { padding: 5px 2px; color: #1160e2; text-align: center; border-left: solid 0px #f4f4f4; font-weight:lighter; font-family: 'Tahoma', sans-serif;font-size:14px; }
.mGrid2 .alt { background: #fcfcfc url('css/grd_alt.png') repeat-x top;  }
.mGrid2 .pgr {background: #b5def3 url('css/grd_pgr.png') repeat-x top; }
    .mGrid2 .pgr table { margin: 2px 0; }
    .mGrid2 .pgr td { border-width: 0; padding: 0 0px; border-left: solid 0px #666; font-weight: normal; color: #fff; line-height: 12px;  }   
    .mGrid2 .pgr a { color: #666; text-decoration: none; }
    .mGrid2 .pgr a:hover { color: #ed931f; text-decoration: none; }     
    
    
    
    
    
    
.BoxRs{
   font-weight:lighter; font-family: 'Prompt', sans-serif;font-size:12px;
    padding: 0px 0px; 
    background: #bfe0f9;
    max-width:100%;
    border-radius: 5px;
    -moz-border-radius: 5px;
-webkit-border-radius: 5px;
}


.img {
max-width:100%;
border-radius: 50%;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
}

.dap_text
{
	/*background-image:url(images/form_bg.jpg);*/
	background-repeat:repeat-x;
	border:1px solid #ededed;
	/*width: 230px;*/
	background-color : #fff;
	color:#000000;
	padding:5px;
	margin-right:5px;
	margin-bottom:5px;
	font-family: 'Prompt', sans-serif;
	font-size:14px;
	font-weight:lighter;
	border-radius:4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	text-align: left;
}

.boxselect_dropdown
{
 /*background-image:url(images/form_bg.jpg);*/
	background-repeat:repeat-x;
	border:1px solid #ededed;
	/*width: 230px;*/
	background-color : #fff;
	color:#000000;
	padding:1px;
	margin-right:1px;
	margin-bottom:1px;
	font-family: 'Prompt', sans-serif;
	font-size:12px;
	font-weight:lighter;
	border-radius:2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	text-align: left;   
}

.dap_text_box
{
	/*background-image:url(images/form_bg.jpg);*/
	background-repeat:repeat-x;
	border:0px solid #ededed;
	/*width: 230px;*/
	background-color : #fff;
	color:#000000;
	padding:3px;
	margin-right:3px;
	margin-bottom:3px;
	font-family: 'Prompt', sans-serif;
	font-size:12px;
	font-weight:lighter;
	border-radius:2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	text-align: left;
}

.dap_text_dropbox
{
	/*background-image:url(images/form_bg.jpg);*/
	background-repeat:repeat-x;
	border:1px solid #ededed;
	/*width: 230px;*/
	background-color : #fff;
	color:#000000;
	padding:1px;
	margin-right:1px;
	margin-bottom:1px;
	font-family: 'Prompt', sans-serif;
	font-size:11px;
	font-weight:lighter;
	border-radius:2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	text-align: left;
}


.select
{
 -moz-appearance: none;
 -webkit-appearance: none;
 appearance: none;
 background: transparent url('example.png') no-repeat right center;
 padding: 1px 20px 1px 1px;
 border: none;
 font-family: 'Prompt', sans-serif;
	font-size:12px;
	font-weight:lighter;
}



   .align_middle {
        vertical-align: middle;
    }

   .align_bottom {
        vertical-align: bottom;
    }



.border 
{
    padding:4px;
	margin-right:4px;
	margin-bottom:4px;
    border-style:solid;
    border-color:#fcff01;
    border-width: 2px;
}





.borderdropdown
{
    padding:2px;
	margin-right:2px;
	margin-bottom:2px;
    border-style:solid;
    border-color:#0d8531;
    border-width: 2px;
}

.bordertxt
{
    padding:1px;
	margin-right:1px;
	margin-bottom:1px;
    border-style:solid;
    border-color:#0d8531;
    border-width: 1px;
}



.bgfooter
{
 background-color: #474b4f;
}

.bgLogin
{
 background-color: #e4e5e5;
}
.bgLogin_user
{
 background-color: #dadcdd;
}






#imaginary_container{
    margin-top:0; /* Don't copy this */
}
.stylish-input-group .input-group-addon{
    background: white !important; 
}
.stylish-input-group .form-control{
	border-right:0 none #ccc; 
	box-shadow:0 0 0; 
	top: 0px;
    left: 0px;
    border-left-color: #ccc;
    border-top-color: #ccc;
    border-bottom-color: #ccc;
}
.stylish-input-group button{
    border:0;
    background:transparent;
}

















/* Don't copy this */


.navbar-default {
  background-color: #3377bb;
  border-color: #6699dd;
}
.navbar-default .navbar-brand {
  color: #ffffff;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
  color: #ffffff;
}
.navbar-default .navbar-text {
  color: #ffffff;
}
.navbar-default .navbar-nav > li > a {
  color: #ffffff;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #ffffff;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #ffffff;
  background-color: #6699dd;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  color: #ffffff;
  background-color: #6699dd;
}
.navbar-default .navbar-toggle {
  border-color: #6699dd;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background-color: #6699dd;
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #ffffff;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border-color: #ffffff;
}
.navbar-default .navbar-link {
  color: #ffffff;
}
.navbar-default .navbar-link:hover {
  color: #ffffff;
}

@media (max-width: 767px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #ffffff;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #ffffff;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #ffffff;
    background-color: #6699dd;
  }
}
