@font-face {
    font-family: "TH SARABUN NEW BOLD";
    src: url("/assets/font/THSarabunNew/THSarabunNewBold.ttf") format("truetype");
}

@font-face {
    font-family: "RSU BOLD";
    src: url("/assets/font//rsufont/RSU_BOLD.ttf") format("truetype");
}


#CloseSystemModal .modal-dialog {
  top: 260px;
  right: 0;
  bottom: 0;
  left: 0px;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 98%;	
}

#cardkeyinModal	.modal-dialog {
  top: 150px;
  right: 0;
  bottom: 0;
  left: 265px;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 1030px;	
}

#NewHNModal	.modal-dialog {
  position: fixed;
  top: 150px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 1030px;
}

#NotRegisterModal	.modal-dialog {
  position: fixed;
  top: 150px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 1030px;  
}

#RegisterModal	.modal-dialog {
  position: fixed;
  top: 50px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 1100px;  
}

#religionModal	.modal-dialog {
  position: fixed;
  top: 80px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 800px;  
}

#phonenoModal	.modal-dialog {
  position: fixed;
  top: 80px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
}

#occupationModal	.modal-dialog {
  position: fixed;
  top: 50px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 1030px;  
}

#ConfirmModal	.modal-dialog {
  position: fixed;
  top: 50px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 1030px;  
}

#ConfirmInsertModal	.modal-dialog {
  position: fixed;
  top: 50px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 700px;  
}

#ConfirmAppointModal .modal-dialog {
  position: fixed;
  top: 50px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 800px;  
}


#mConfirmAppointModal .modal-dialog {
  position: fixed;
  top: 10px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 95%;  
}

#mConfirmInsertModal .modal-dialog {
  position: fixed;
  top: 10px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 95%;  
}

#mQueueList .modal-dialog {
  position: fixed;
  top: 10px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 95%;  
}

#mConfirmQueueListExit .modal-dialog {
  position: fixed;
  top: 10px;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10040;
  overflow: auto;
  overflow-y: auto;
  width: 95%;  
}

.icon-service {
	width:160px;
	height:121px;
}

.notifyjs-bootstrap-base{
	font-family: "TH SARABUN NEW BOLD";
    font-size:30px;	
}
.list-group-item {
    height: 35px;
}

li a:hover{

    background: red;
    color: white;
}

.btn-green {
    border: 0;
    text-shadow: 0px 1px 0px #465909;
    background-color: #7f9d21;
    -webkit-box-shadow: 0px 6px 0px #465909;
    -moz-box-shadow: 0px 6px 0px #465909;
    box-shadow: 0px 6px 0px #465909;
}

.btn-purple {
    border: 0;
    text-shadow: 0px 1px 0px #7870b8;
    background-color: #8a80d6;
    -webkit-box-shadow: 0px 6px 0px #7870b8;
    -moz-box-shadow: 0px 6px 0px #7870b8;
    box-shadow: 0px 6px 0px #7870b8;
}

.btn-orange {
    border: 0;
    text-shadow: 0px 1px 0px #ce7024;
    background-color: #fa872a;
    -webkit-box-shadow: 0px 6px 0px #ce7024;
    -moz-box-shadow: 0px 6px 0px #ce7024;
    box-shadow: 0px 6px 0px #ce7024;
}

.btn-gray {
    border: 0;
    text-shadow: 0px 1px 0px #4f4e4e;
    background-color: #808080;
    -webkit-box-shadow: 0px 6px 0px #4f4e4e;
    -moz-box-shadow: 0px 6px 0px #4f4e4e;
    box-shadow: 0px 6px 0px #4f4e4e;
}

.btn-blue {
    border: 0;
    text-shadow: 0px 1px 0px #3671a4;
    background-color: #428bca;
    -webkit-box-shadow: 0px 6px 0px #3671a4;
    -moz-box-shadow: 0px 6px 0px #3671a4;
    box-shadow: 0px 6px 0px #3671a4;
}

.btn-cyan {
    border: 0;
    text-shadow: 0px 1px 0px #01d2d2;
    background-color: #00FFFF;
    -webkit-box-shadow: 0px 6px 0px #01d2d2;
    -moz-box-shadow: 0px 6px 0px #01d2d2;
    box-shadow: 0px 6px 0px #01d2d2;
}

th.dt-center, td.dt-center { text-align: center; }

.grayText{ background-color:#808080; }
.greenText{ background-color:#7f9d21; }
.blueText{ background-color:#428bca; }
.orangeText{ background-color:#fa872a; }
.purpleText{ background-color:#8a80d6; }
.cyanText{ background-color:#00FFFF; }

.example1 {
 height: 50px;	
 overflow: hidden;
 position: relative;
}
.example1 h1 {
 position: absolute;
 width: 100%;
 height: 100%;
 margin: 0;
 line-height: 50px;
 text-align: center;
 /* Starting position */
 -moz-transform:translateX(100%);
 -webkit-transform:translateX(100%);	
 transform:translateX(100%);
 /* Apply animation to this element */	
 -moz-animation: example1 30s linear infinite;
 -webkit-animation: example1 30s linear infinite;
 animation: example1 30s linear infinite;
}
/* Move it (define the animation) */
@-moz-keyframes example1 {
 0%   { -moz-transform: translateX(100%); }
 40%   { -moz-transform: translateX(0%); }
 60%   { -moz-transform: translateX(0%); }
 100% { -moz-transform: translateX(-100%); }
}
@-webkit-keyframes example1 {
 0%   { -webkit-transform: translateX(100%); }
 40%   { -webkit-transform: translateX(0%); }
 60%   { -webkit-transform: translateX(0%); }
 100% { -webkit-transform: translateX(-100%); }
}
@keyframes example1 {
 0%   { 
 -moz-transform: translateX(100%); /* Firefox bug fix */
 -webkit-transform: translateX(100%); /* Firefox bug fix */
 transform: translateX(100%); 		
 }
 40%   { 
 -moz-transform: translateX(0%); /* Firefox bug fix */
 -webkit-transform: translateX(0%); /* Firefox bug fix */
 transform: translateX(0%); 		
 }
 60%   { 
 -moz-transform: translateX(0%); /* Firefox bug fix */
 -webkit-transform: translateX(0%); /* Firefox bug fix */
 transform: translateX(0%); 		
 }
 100% { 
 -moz-transform: translateX(-100%); /* Firefox bug fix */
 -webkit-transform: translateX(-100%); /* Firefox bug fix */
 transform: translateX(-100%); 
 }
}

.queue-btn-green {
    border: 0;
    text-shadow: 0px 1px 0px #7f9d21;
    background-color: #657342;
    -webkit-box-shadow: 0px 6px 0px #7f9d21;
    -moz-box-shadow: 0px 6px 0px #7f9d21;
    box-shadow: 0px 6px 0px #7f9d21;
}

.queue-btn-purple {
    border: 0;
    text-shadow: 0px 1px 0px #7664a7;
    background-color: #4a2d9b;
    -webkit-box-shadow: 0px 6px 0px #7664a7;
    -moz-box-shadow: 0px 6px 0px #7664a7;
    box-shadow: 0px 6px 0px #7664a7;
}
