﻿A
{
    TEXT-DECORATION: none; 

}
A:visited
{
    TEXT-DECORATION: none; 
}
A:hover
{
    
    TEXT-DECORATION: none;    
}
@media (min-width:1280px){.tu-hide-more1280{display:none!important}}
@media (max-width:1280px) and (min-width:1080px){.tu-hide-1280-1080{display:none!important}}
@media (max-width:1080px) and (min-width:700px){.tu-hide-1080-700{display:none!important}}
@media (max-width:700px){.tu-hide-less700{display:none!important}}
@media (max-width:900px){.tu-hide-less900{display:none!important}}
@media (min-width:900px){.tu-hide-max900{display:none!important}}
@media (max-width:1190px) and (min-width:512px){.tu-hide-1190-512{display:none!important}}
@media (max-width:1180px){.tu-hide-less1180{display:none!important}}
@media (max-width:1050px){.tu-hide-less1050{display:none!important}}
@media (max-width:880px){.tu-hide-less880{display:none!important}}
@media (max-width:710px){.tu-hide-less710{display:none!important}}
@media (min-width:710px){.tu-hide-max710{display:none!important}}
/*  class ทั้งหมดใช้สำหรับกำหรับเช็คความละเอียดของหน้า broser ที่เปิดบนอินเตอร์เน็ต เพื่อจะกำหนดการแสดงผลหน้าเวบไซต์ 
tu-hide-more1280
tu-hide-1280-1080
tu-hide-1080-700
tu-hide-less700
*/
.bgmenubar{
  background-color: #151515; 
  margin-left: 6%;
}

a.tulink1:link, a.tulink1:visited {
	/*font-family: Arial, Helvetica, sans-serif;
    //background-color: #003366;
	//border: 2px solid #f46802;*/
    color: #d7d4d5;
    padding: 0.5% 2%;
	//font-size: 1vw; 
    text-align: center;
    text-decoration: none;
    display: inline-block;
	/*border-bottom-left-radius: 1em;
    //border-bottom-right-radius: 1em;
    //border-top-left-radius: 1em;
    //border-top-right-radius: 1em;*/
}
a.tulink1:hover, a.tulink1:active{color: #db1d2d;}
a.tulink2:link, a.tulink2:visited {
    color: #d7d4d5;
    padding: 0.5% 2%;
	/*/font-size: 1vw; */
    text-align: center;
    text-decoration: none;
    display: inline-block;
}
a.tulink2:hover, a.tulink2:active {color: #db1d2d;}
.padmenu {padding: 0.5% 0.01%;}

@import url('https://fonts.googleapis.com/css?family=Chakra+Petch&display=swap');
body,h1,h2,h3,h4,h5,p,a,span,b{
		font-family: 'Chakra Petch', sans-serif;
	}	
@media screen and (min-width: 1180px) {	
p,a,span{font-size: 105%;}
h1{font-size: 300%;}
h2{font-size: 180%;}	
h3{font-size: 155%;}
h4{font-size: 120%;}
.tulink1{font-size: 125%;} /*----ขนาด font menuข-----------------*/
.fontwebsmall{font-size: 70%;} /*----ขนาด font เล็กสุด-----------------*/
}
@media screen and (max-width:1180px) and (min-width:700px) {	
p,a,span{font-size: 90%;}
h1{font-size: 270%;}
h2{font-size: 160%;}	
h3{font-size: 145%;}
h4{font-size: 110%;}	
.tulink1{font-size: 1.5vw;} /*----ขนาด font menuข-----------------*/
.fontwebsmall{font-size: 65%;} /*----ขนาด font เล็กสุด-----------------*/
}
@media screen and (max-width: 700px) {	
p,a,span{font-size: 86%;}
h1{font-size: 255%;}
h2{font-size: 170%;}	
h3{font-size: 120%;}
h4{font-size: 110%;}	
.tulink1{font-size: 0.4vw;} /*----ขนาด font menuข-----------------*/
.fontwebsmall{font-size: 60%;} /*----ขนาด font เล็กสุด-----------------*/
}

/*---------------------PRODUCT------------------------------------------*/
.bgpprod{
	background-color: #f3f3f3;
	
}
.spprod2{
	text-align: center;
	background-color: #fFFFFF;
	
}
.prod2{
	width: 25%;
	padding: 10px;	
	cursor: pointer;
}

@media screen and (max-width: 900px){
	.prod2{
			width: 50%;
		}		
	}
.prod{
	cursor: pointer;
	padding: 5px;
	cursor: pointer;
}
.prod:hover{
	background-color: #E1E1E1;
	
}
.prod:hover img{
	transition: all 0.5s ease;
	filter: brightness(0.5);
}

/*------------------------------------------------------------------>*/	
.tu-bgpprod{
	background-color: #f3f3f3;
	
}
.tu-prod2{
	width: 25%;
	background-color: #f3f3f3;
	//margin: 1% 0px 1% 0px;
	cursor: pointer;
	text-align: center;
}
@media screen and (max-width: 900px){
	.tu-prod2{
			width: 50%;
		}		
	}
.tu-spprod2,.tu-spprod2:visited{
	//width: 0.5%;
	border: 1px solid #d1d1d1;
	border-radius: 3px;
	margin-right: 4%;
	background-color: #ffffff;
	TEXT-DECORATION: none; 
}	
.tu-spprod2:hover{/*---สี over mouse บนพื้นของกรอบสินค้า*/
	background-color: #e1e1e1;
	border: 2px solid #ffbdc3;
	TEXT-DECORATION: none; 
}
.tu-spprod2:hover img{
	transition: all 0.5s ease;
	filter: brightness(0.5);
	TEXT-DECORATION: none; 
}
.tu-workpro{
	//padding: 2%;
}
.tu-sub-workpro{
	//margin-left: 4%;
	padding: 5%;
	//float: left;
	text-align: left;
	color: #4a4949;
}
.tu-price{
	color: red;
}
.tu-item{
	color: #000;
}
.tu-detail{
	color: #5a5a59;
}
.buttonx {
    background-color: Black; /* Green */
	width: 100%;
    border: none;
    color: white;
    padding: 8px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    //font-size: 16px;
    margin: 4px 2px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
}
.fontwebsmall{	
	//font-size: 12px;
	color: #464646;
}
.viwide{	
width: 95%;
}
img.picpro {
  width: 100%;
  height: auto;
}

.tu-row {
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -ms-flex-wrap: wrap; /* IE10 */
    flex-wrap: wrap;
	word-wrap: break-word;
    padding: 0.5% 0.5%;/* ขอบด้านอกของ BG */
}

/*---------------เริ่มสำหรับทำแสดง column product 2 co on mobile NEW NEW-----*/
.flex-container{
    display: flex;
	flex-direction: column; /* ค่า default จะเป็น row */
	flex-wrap: wrap;
	//align-items: center;
	//justify-content: center;
	 //margin: 0% 0.5% 0% 0.5%;
}
.flex-container1{
    display: flex;
	flex-direction: row; /* ค่า default จะเป็น row */
	flex-wrap: wrap;
	//align-items: center;
	//justify-content: center;
}
.content1,.content1:visited{
    flex-grow: 1;
	order: 3;
	margin: 0.8% 0.5% 0.8% 0.5%;/*กำหนดขอบเขตของงานภายใน โดยเ้วนขอบรอบชิ้นงานไว้เท่าไหร่*/
	border: 1px solid #d1d1d1;/*กรอบสี่เหลี่ยมด้านในรูป*/
	border-radius: 3px;
	cursor: pointer;
	TEXT-DECORATION: none;
	background-color: #ffffff;
    }
.content1:hover{/*---สี over mouse บนพื้นของกรอบสินค้า*/
	background-color: #e1e1e1;
	border: 2px solid #478fc8;
	TEXT-DECORATION: none; 
}	
.primary1,.primary1:visited{
    flex-grow: 1;
	order: 1;
	margin: 0.8% 0.5% 0.8% 0.5%;/*กำหนดขอบเขตของงานภายใน โดยเ้วนขอบรอบชิ้นงานไว้เท่าไหร่*/
	border: 1px solid #d1d1d1;	/*กรอบสี่เหลี่ยมด้านในรูป*/
	border-radius: 3px;
	cursor: pointer;
	TEXT-DECORATION: none;
	background-color: #ffffff;
    }
.primary1:hover{/*---สี over mouse บนพื้นของกรอบสินค้า*/
	background-color: #e1e1e1;
	border: 2px solid #478fc8;
	TEXT-DECORATION: none; 
}
	
@media screen and (min-width:800px){
    .flex-container{
        flex-direction: row;
		//justify-content: flex-start; /* flex-start | center | flex-end */
		
    }
.content{
        flex-grow: 1;
		order: 3;
		
    }
.primary{
        flex-grow: 1;
		order: 1;
		
    }
    .secondary{
        flex-grow: 1;
		order: 2;
    }
    .enditem{
        flex-grow: 1;
		order: 2;
    }	
}

/*-----------------------------------------------------------------------------------------*/