/*=============================================================================
 * Stylesheet for Lfanclub
 * Author 		zubvector
 
 * @file		theme_Lfanclub.css
 * @version		1
 * @browsers	Windows: IE6+, Opera7+, Firefox1+, 
 				Mac OS: Safari2+, Firefox2+

 * @copyright	2015 Lfanclub. All Rights Reserved. 
===============================================================================*/
@charset "utf-8";

/*================================================================================
general styles for all CSS Checkboxes
=================================================================================*/
/*label {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}*/

input[type=checkbox].css-checkbox {
	  position: absolute; 
    overflow: hidden; 
    clip: rect(0 0 0 0); 
    height:1px; 
    width:1px; 
    margin:-1px; 
    padding:0;
    border:0;
}

input[type=checkbox].css-checkbox + label.css-label {
	padding-left:30px;
	height:20px; 
	display:inline-block;
	line-height:20px;
	background-repeat:no-repeat;
	background-position: 0 0;
	font-size:15px;
	vertical-align:middle;
	cursor:pointer;
}

input[type=checkbox].css-checkbox:checked + label.css-label {
	background-position: 0 -20px;
}

/*specific classes related to Checkbox skins*/

.lite-green-check{background-image: url(../img/lite-green-check2.png);}


input[type=checkbox].css-checkbox.med + label.css-label.med {
	padding-left:22px;
    height:20px; 
	display:inline-block;
	line-height:20px;
	background-repeat:no-repeat;
	background-position: 0 0;
	font-size:15px;
	vertical-align:middle;
    cursor:pointer;
}

input[type=checkbox].css-checkbox.med:checked + label.css-label.med {

    background-position: 0 -20px;
}
input[type=checkbox].css-checkbox.sme + label.css-label.sme {
	padding-left:22px;
    height:16px; 
	display:inline-block;
	line-height:16px;
	background-repeat:no-repeat;
	background-position: 0 0;
	font-size:15px;
	vertical-align:middle;
    cursor:pointer;
}

input[type=checkbox].css-checkbox.sme:checked + label.css-label.sme{

    background-position: 0 -16px;
}
input[type=checkbox].css-checkbox.lrg + label.css-label.lrg {
	padding-left:22px;
    height:20px; 
	display:inline-block;
	line-height:20px;
	background-repeat:no-repeat;
	background-position: 0 0;
	font-size:15px;
	vertical-align:middle;
    cursor:pointer;
}

input[type=checkbox].css-checkbox.lrg:checked + label.css-label.lrg{

    background-position: 0 -20px;
}
/*================================================================================
@font-face  Generated by Font Squirrel
=================================================================================*/
html {
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
	/*-webkit-font-smoothing: subpixel-antialiased;*/
	/*text-shadow: 1px 1px 1px rgba(0,0,0,0.004) !important;*/
}

@font-face {
    font-family: 'bangna_newregular';
    src: url('../fonts/bangna-new.eot');
    src: url('../fonts/bangna-new.eot?#iefix') format('embedded-opentype'),
         url('../fonts/bangna-new.woff2') format('woff2'),
         url('../fonts/bangna-new.woff') format('woff'),
         url('../fonts/bangna-new.ttf') format('truetype'),
         url('../fonts/bangna-new.svg#bangna_newregular') format('svg');
    font-weight: normal;
    font-style: normal;	
}

@font-face {
  font-family: 'NotoSansThaiUI';
  src: url('../fonts/NotoSansThaiUI.eot?#iefix') format('embedded-opentype'),  
  url('../fonts/NotoSansThaiUI.woff') format('woff'), 
  url('../fonts/NotoSansThaiUI.ttf')  format('truetype'), 
  url('../fonts/NotoSansThaiUI.svg#NotoSansThaiUI') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'NotoSansThaiUI-Bold';
  src: url('../fonts/NotoSansThaiUI-Bold.eot?#iefix') format('embedded-opentype'), 
   url('../fonts/NotoSansThaiUI-Bold.woff') format('woff'), 
   url('../fonts/NotoSansThaiUI-Bold.ttf')  format('truetype'), 
   url('../fonts/NotoSansThaiUI-Bold.svg#NotoSansThaiUI-Bold') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
    font-family: 'thaisans_neuebold';
    src: url('../fonts/thaisansneue-bold.eot');
    src: url('../fonts/thaisansneue-bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/thaisansneue-bold.woff2') format('woff2'),
         url('../fonts/thaisansneue-bold.woff') format('woff'),
         url('../fonts/thaisansneue-bold.ttf') format('truetype'),
         url('../fonts/thaisansneue-bold.svg#thaisans_neuebold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'thaisans_neueregular';
    src: url('../fonts/thaisansneue-regular.eot');
    src: url('../fonts/thaisansneue-regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/thaisansneue-regular.woff2') format('woff2'),
         url('../fonts/thaisansneue-regular.woff') format('woff'),
         url('../fonts/thaisansneue-regular.ttf') format('truetype'),
         url('../fonts/thaisansneue-regular.svg#thaisans_neueregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'thaisans_neuesemi_bold';
    src: url('../fonts/thaisansneue-semibold.eot');
    src: url('../fonts/thaisansneue-semibold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/thaisansneue-semibold.woff2') format('woff2'),
         url('../fonts/thaisansneue-semibold.woff') format('woff'),
         url('../fonts/thaisansneue-semibold.ttf') format('truetype'),
         url('../fonts/thaisansneue-semibold.svg#thaisans_neuesemi_bold') format('svg');
    font-weight: normal;
    font-style: normal;

}

/*================================================================================
Button
==================================================================================*/
.btn-primary {
  color: #fff;
  background-color: #0066cb;
  border-color: #2e6da4;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #fff;
  background-color: #0055aa;
  border-color: #204d74;
}

.btn-reward {
  color: #fff;
  background-color: #fc215e;
  border-color: #2e6da4;
}
.btn-reward:hover,
.btn-reward:focus,
.btn-reward.focus,
.btn-reward:active,
.btn-reward.active,
.open > .dropdown-toggle.btn-reward {
  color: #fff;
  background-color: #cf2554;
  border-color: #204d74;
}
/*================================================================================
Theme
==================================================================================*/
body{
	background:url(../img/pattern-bg.jpg); 
	padding-top: 70px; /*เผื่อ navbar-fixed-top สูง 70px*/			
	padding-bottom: 30px;
	font-family: 'NotoSansThaiUI', sans-serif;
	font-size: 14px;
	color:#252525;
}
body.no-fixbar{padding-top: 0px; padding-bottom: 80px;}



.centerAlign{
	text-align:center;
	vertical-align:middle;
}	


.logohome{ text-align:center; width: 57px; margin: 0 auto;  }
.logohome img:not(.png) { width: 100%;}


.navbar-inverse .navbar-nav > li > a{
	color:#005577;		
	font-family: 'bangna_newregular', sans-serif;
	font-size: 13px;	
	font-weight:bold;
}

h1, .h1{ 
	font-family: 'bangna_newregular', sans-serif;
	color:#464646;
	margin-top: 25px;
	font-size: 25px;
	font-weight:bold;
	margin-bottom: 25px;
}
h2, .h2{ 
	font-family: 'thaisans_neuebold';	
	color:#005771;
	margin-top: 40px;
	font-size: 24px;
	font-weight: normal;
	margin-bottom: 15px;
}

h1.logohead{ 
	font-family: 'bangna_newregular';
	text-align:center;
	color:#3498db;
	margin-top: 70px;
	font-size: 36px;
	font-weight:bold;
}
.subhead{
	font-family: 'bangna_newregular';
	text-align: center;	
	font-size: 18px;
	font-weight:bold;
	
}

label{ 
	font-family: 'bangna_newregular';
	color:#919191;	
	font-weight:bold;
}
.remark{ 
	font-family: 'NotoSansThaiUI', sans-serif;
	font-size: 16px;
	color:#F00;
 }
.form-txt{ 
	font-family: 'bangna_newregular';
	color:#919191;
	font-weight:bold;
	
	margin-top: 8px;
}

.btn{font-weight:bold; font-family: 'bangna_newregular'; margin-top: 30px;}
.input-group-addon > img{ width:16px;}

.navbar-fixed-bottom{ 
	background-color:#11a2d9;
	padding-top:12px;
}
.navbar-fixed-bottom a{
	font-weight:bold;
	color:#FFF;
	font-size: 16px;
}
input, select{font-family: 'NotoSansThaiUI', sans-serif; }

.chosen-select{font-family: 'NotoSansThaiUI', sans-serif;}
.round-button {
    display:block;
    width:70px;
    height:70px;
    line-height:70px;
    border-radius: 50%;
    color:#f5f5f5;
    text-align:center;
    text-decoration:none;
    background: #33a3c9;
    /*box-shadow: 0 0 3px gray;*/
    font-size:20px;
    font-weight:bold;
	margin: 10px auto;
}
.round-button:hover {
    background: #3abeeb;
}

.round-button img {
	width:70px;
    height:70px;
	margin: auto;
}

.round-btn-blue {background: #33a3c9;}
.round-btn-blue:hover{background: #32c0f2;}
/*.round-btn-green {background: #27c1b9;}
.round-btn-green:hover{background: #27ede1;}*/
.round-btn-green {background: #85ce05;}
.round-btn-green:hover{background: #99be58;}
.round-btn-purple {background: #9b58b5;}
.round-btn-purple:hover{background: #b35dd5;}
.round-btn-navy {background: #34495e;}
.round-btn-navy:hover{background: #4b6680;}
.round-btn-yellow {background: #f1c40f;}
.round-btn-yellow:hover{background: #ffd429;}
.round-btn-red {background: #cf2554;}
.round-btn-red:hover{background: #fc215e;}
.round-btn-orange {background: #f26522;}
.round-btn-orange:hover{background: #ff793a;}

.round-btn-txt {
	/*font-family: 'NotoSansThaiUI', sans-serif;*/
	font-family: 'bangna_newregular', sans-serif;
	font-size: 16px;
	font-weight:bold;
	color:#464646;
}

.round-btn-comingsoon {background: #dddddd;}
.round-btn-comingsoon:hover{background: #dddddd;}
.round-btn-txt-comingsoon{
	font-family: 'bangna_newregular', sans-serif;
	font-size: 16px;
	font-weight:bold;
	color:#dddddd;
}
	
.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.navbar-brand img {  margin-top: -10px; }
.navbar-inverse .navbar-text{
	font-family: 'NotoSansThaiUI', sans-serif;
	font-size: 20px;
	
	
	line-height: 16px;
	color:#FFFFFF;
	margin-left:0;
}
.navbar-fixed-bottom a{
	font-family: 'bangna_newregular', sans-serif;
	font-size: 14px;
	font-weight:bold;
}

.nav-logo{ float:right; margin-top: 10px; }
.nav-logohome{ float:left; position:absolute;  margin-left: 50%; left: -57px;}
.logohead{ margin-top: 80px; }

.banner  div{ margin-top: 30px; margin-bottom: 10px;}

.round-icon {
    display:block;
    width:50px;
    height:50px;
    line-height:30px;
    border-radius: 50%;
    background: #c7c7c7;
	text-align:center;
	float:left; 
	margin-top: -15px;
	margin-right: 10px;
}
.round-icon img{width:50px; height:50px;}

.content-area-last{padding-bottom: 20px;}
.content-area{border-bottom: solid 1px #CCCCCC; padding-bottom: 20px;}


a.btn-edit{ 
	width:16px; height:16px; background: url(../img/btn-edit.png); display:inline-block; margin-right: 5px;
}
a.btn-edit span{ display:none;}
a.btn-edit:hover{ background-position: 0 16px;
}

a.btn-delete{ 
	width:16px; height:16px; background: url(../img/btn-delete.png); display:inline-block; 
}
a.btn-delete span{ display:none;}
a.btn-delete:hover{ background-position: 0 16px;
}

.table-striped > tbody > tr:nth-of-type(2n+1) {
    background-color: #f2f2f2;
}

table { background:#FFF; border:solid 2px #0271a4; }

table th{ 
	background:#009dcd;
	font-family: 'bangna_newregular', sans-serif;
	font-size: 14px;
	font-weight:bold;
	color:#FFFFFF;
}

table .table-foot{
	background:#02baf2;		
	font-family: 'bangna_newregular', sans-serif;
	font-size: 18px;
	font-weight:bold;	
	color:#FFFFFF; 		
}




table .date{
	background:#cccccc;
	color:#000000;
	padding: 2px 8px !important;
	font-size:10px;  line-height:10px;
	font-weight:bold;
}




table .serial{ width: 40%;}
table .price{ width: 20%; text-align:right;}
table .edit{ width: 10%;  }
table .point{ width: 20%; text-align:right;}
table .amount{ width: 15%;  text-align:right; }
table .amount input.form-control{ float:right; }
table .redeem-date{font-size:11px; }

table .status{text-align:center;}
table td.status { font-size:small; color:#ffd105;}






div.status-remark{ margin-bottom: 20px;}



table.table-wait{ border:solid 2px #ffd921; }
table.table-wait th{ 
	background:#ffd105;
}
table.table-wait .date{
	background:#fff29a;
}
table.table-wait td{ border-top: solid 1px #fff29a !important;}



table.table-approve{ border:solid 2px #009dcd; }
table.table-approve th{ 
	background:#009dcd;	
}
table.table-approve .date{
	background:#baddf7;
}
table.table-approve td.status{color:#090;}



table.table-point{ border:solid 2px #ffbd37; }
table.table-point th{ 
	background:#ffac03;	
}
table.table-point .date{
	background:#ffdd9a;
}
table.table-point .table-foot{
	background:#ffbd37;			
}
table.table-point td.status{color:#090;}




/*table.table-green{ border:solid 2px #d5dc45; }
table.table-green th{ 
	background:#c5cb38;	
}
table.table-green .date{
	background:#ecefaa;
}
table.table-green td{ border-top: solid 1px #ecefaa !important;}
table.table-green .table-foot{
	background:#d0d72d;			
}*/

table.table-warranty{ border:solid 2px #b16fdd; }
table.table-warranty th{ 
	background:#a75cd9;	
}
table.table-warranty .date{
	background:#dcbdf0;
}
table.table-warranty td{ border-top: solid 1px #e8d4f5 !important;}
table.table-warranty .table-foot{
	background:#a75cd9;			
}

/*table .total{
	background:#02baf2;	
	font-weight:bold;
	color:#FFFFFF; 		
}*/

/*table .total-approve{	
	font-weight:bold;
	color:#FFFFFF;		
	background:#02baf2;
}
*/
/*table .total-approve td{border-top: none !important;}*/



table.table-reward { border:solid 2px #f8a0c5; }
table.table-reward th{ 	
	font-family: 'bangna_newregular', sans-serif;
	font-size: 14px;
	font-weight:bold;
	color:#FFFFFF;
	
	background:#ec1672;
}
table.table-reward .date{
	background:#dcbdf0;
}
table.table-reward td{ border-top: solid 1px #e8d4f5 !important;}
table.table-reward .table-foot{
	background:#f03182;	
}
table.table-reward td.status{color: #919191;}



table.table-reward img{ width:150px; height: 100px;}
table.table-reward input.form-control {width: 50px;}



table.table-download { border:solid 2px #fb793b; }
table.table-download th{ 	
	font-family: 'bangna_newregular', sans-serif;
	font-size: 14px;
	font-weight:bold;
	color:#FFFFFF;
	
	background:#f26522;
}




.point-remain{ 
	font-family: 'bangna_newregular', sans-serif;
	color:#6C0;	
	font-weight:bold;
	font-size: 30px;
}
.member{
	/*font-family: 'thaisans_neuesemi_bold';*/
	font-family: 'thaisans_neueregular';
	font-size:20px;
	line-height: 16px;
	color:#039;
}
.member-txt{
	/*font-family: 'thaisans_neuesemi_bold';*/
	font-family: 'thaisans_neueregular';
	font-size:20px;
	line-height: 16px;
}

.pending{color: #ffd105;}
.reject{ color:#F00;}
.approve{color: #6C0;}
.expire{ color:#F00;}