/* CSS Document */
/*เมนู Top */
.w3-menuTop,.w3-hover-menuTop:hover{color:#333!important;background-color:#cadff0!important; font-weight:bold;}   /* bgc1*/
.w3-color,.w3-color:hover{color:#000!important;background-color:#cadff0  ;}
.w3-bar-item, .w3-button{font-size: 16px; background-color:#cadff0; }  /* bgc1*/

 

.w3-large{font-size:16px!important;font-weight:bold; }
.w3-button:hover{color:#000!important;background-color:#9cd8fe!important}   /* bgc2*/

.w3-dropdown-content{line-height:35px; font-weight:normal;}

.w3-dropdown-hover:first-child,.w3-dropdown-click:hover{background-color:#ccc;color:#000}
.w3-dropdown-hover:hover > .w3-button:first-child,.w3-dropdown-click:hover > .w3-button:first-child{background-color:#9cd8fe;color:#333}  /* bgc2*/
a.btn_border { border-top: 1px solid #b8d6f0 !important;  }   /* bgc2*/

.w3-content{max-width:1080px;margin:auto}.w3-rest{overflow:hidden}
a#a_prd{text-decoration:none; color:#465a74; display: block;}
a#a_prd:hover{text-decoration:none; color:#1f3f6a;}

/*ปุ่มเพิ่มหมวดหมู่สินค้า */
.buttonAdd{ margin:5px; margin-bottom:5px; padding: 5px; text-align:center; background-color:#bee0fc; border:1px solid #aaa; width:97%; }
/*ปุ่ม แก้ไข ลบ */
.buttonEdit{ 
margin:5px; margin-bottom:5px; padding: 8px; text-align:center; background-color:#bee0fc; border:1px solid #aaa; font-size: 18px;
text-decoration:none;
}
 a.w3-button{
text-decoration:none;
}

#title_top{margin-bottom:8px; padding-bottom: 6px; border-bottom: 0px solid #ddd; color:#333;}

body,h1,h2,h3,h4,h5,h6 {font-family: "Lato", sans-serif}
.w3-bar,h1,button {font-family: "Montserrat", sans-serif}
.fa-anchor,.fa-coffee {font-size:200px}
body{background:#eeeeee;}
.w3-container{
background:#fff;
}
input{padding:5px;}

.non_data{
padding:50px; color:red; margin:20px; border: 1px solid #ddd; text-align:center;
}
 #title-top{
  display: block;
  width: 100%;
  margin-bottom: 3px;
  line-height: 28px;
  color: #053065;
  border-bottom: 1px solid #eee; 
}

/* w3-bar-product */
.w3-bar .w3-bar-product{padding:8px 5px; float:left; width:auto;border:none;display:block;outline:0; background:#fff;}

/*ปุ่ม fb */
.btn {
  width: 100%;
  padding: 12px;
  border: none;
  border-radius: 4px;
  margin: 5px 0;
  opacity: 0.85;
  display: inline-block;
  font-size: 17px;
  line-height: 20px;
  text-decoration: none; /* remove underline from anchors */
}
.fb {
  background-color: #3B5998;
  color: white;
}
.fb:hover{
  background-color: #255ec8;
  color: white;
}
/* end ปุ่ม fb */


#shw_prd_txt:hover{
background-color: #fff;
}

.w3-card,.w3-card-2{box-shadow:0 5px 5px 0 rgba(0,0,0,0.16),0 1px 10px 0 rgba(0,0,0,0.12)}
.w3-card:hover,.w3-card-2{background-color: #fff; box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)}
.w3-card{ background-color: #fff; }
.w3-card:hover{ background-color: #fff; }
#w_prd{line-height:18px;}
#shw_prd_txt{ background-color: #f8faff;  height: 80px;}
#shw_prd_txt:hover{  background-color: #fff; height: 80px;}
#title_prd{color:#555953; font-weight:normal; padding:0px; padding-left: 5px; padding-top: 5px; }
#price_prd{padding-left: 5px; color:#CC3300; text-align:left; }
#photo_prd{
padding-top: 5px; padding-bottom: 3px;
}
#photo_prd:hover{
padding-top: 5px; padding-bottom: 3px;
}
#font12{ font-size: 12px; color: #666; }
#font13{ font-size: 13px; color: #333; }
 

/* start แสดงสินค้า */
@media screen and (max-width: 1980px){ /* start max-width: 1980px ---------------------------------------------------------------- */

.menu_left_type a{color: #666;}
.menu_left_type a:hover{color: #333;}

 .shw_prd_type{width: 100%; height: 110px; border-bottom: 0px solid #eee;}
 .shw_prd{width: 100%; height: 130px; border-bottom: 0px solid #eee;}

 .shw_prd_type_m4{width:28.33333%;}
 .shw_prd_type_m8{width:71.66666%;}

.menu_left_type_category:hover{background-color: #e2f0fa; }
.shw_cry_type_m4{width:8.33333%;}
.shw_cry_type_m8{width:91.66666%;}

#logo{height:auto; width:362px; border:0px; margin-top: 10px;}


#w_prd{width:24.99999%; }
#w_type{width:49.99%; } 
#w_prd_q{width:16.66666%; }
#w_article{width:49.99%; } 
}	
	
@media screen and (max-width: 1024px){ /* start max-width: 1024px ---------------------------------------------------------------- */

#logo{height:auto; width:362px; border:0px; margin-top: 10px;}

#w_prd{width:33.33%;}
#w_type{width:99.99%; } 
#w_prd_q{width:24.99999%; }
#w_article{width:49.99%; } 

}
	
@media screen and (max-width: 768px;){ /* start max-width: 768px ---------------------------------------------------------------- */

#logo{height:auto; width:362px; border:0px; margin-top: 10px;}
 
 .shw_prd_type_m4{width:16.66666%}
 .shw_prd_type_m8{width:83.33333%}



#w_prd{width:33.33%}
#w_prd_q{width:33.33%;}
#w_article{width:49.99%; } 
}
	
@media screen and (max-width: 640px){ /* start max-width: 640px ---------------------------------------------------------------- */

#logo{height:auto; width:362px; border:0px; margin-top: 10px;}

#w_prd{width:49.99%}
#w_prd_q{width:33.33%;}
}

@media screen and (max-width: 480px){ /* start max-width: 480px ---------------------------------------------------------------- */
#logo{height:auto; width:100%; border:0px; margin-top: 10px;}

 .shw_prd_type_m4{width:28.33333%}
 .shw_prd_type_m8{width:71.66666%}


#w_prd{width:49.99%}
#w_prd_q{width:49.99%;}
#w_article{width:99.99%; } 
}

@media screen and (max-width: 312px){ /* start max-width: 312px ---------------------------------------------------------------- */

#w_prd{width:99.99%}
#w_prd_q{width:99.99%;}
#w_article{width:99.99%; } 
}
/* end แสดงสินค้า */
h1{ }

 input, select, textarea{
		background: #d7edfe;
		padding-left: 2px;
		padding: 5px;
		margin: 2px;
		border:0px solid #ccc;
	}
 a#link_prd{
text-decoration:none;

}
 a#link_prd:hover{
text-decoration:none;
 
}