@font-face {
  font-family: 'FC Crayon Regular';
  src: url("../fonts/FC Crayon Regular.eot");
  src: url("../fonts/FC Crayon Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/FC Crayon Regular.woff") format("woff"), url("../fonts/FC Crayon Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'SukhumvitSetMedium';
  src: url("../fonts/SukhumvitSetMedium.ttf");
  src: url("../fonts/SukhumvitSetMedium.eot?#iefix") format("embedded-opentype"), url("../fonts/SukhumvitSetMedium.woff") format("woff"), url("../fonts/SukhumvitSetMedium.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'SukhumvitSetBold';
  src: url("../fonts/SukhumvitSetBold.ttf");
  src: url("../fonts/SukhumvitSetBold.eot?#iefix") format("embedded-opentype"), url("../fonts/SukhumvitSetBold.woff") format("woff"), url("../fonts/SukhumvitSetBold.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Itim-Regular';
  src: url("../fonts/Itim-Regular.ttf");
  src: url("../fonts/Itim-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Itim-Regular.woff") format("woff"), url("../fonts/Itim-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'HomemadeApple-Regular';
  src: url("../fonts/HomemadeApple-Regular.ttf");
  src: url("../fonts/HomemadeApple-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/HomemadeApple-Regular.woff") format("woff"), url("../fonts/HomemadeApple-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

body {
  font-family: 'FC Crayon Regular';
  background-color:#f7f0d6;
}
#bg_main #video img {
  width: 100%;
  -moz-box-shadow: -4px 10px 40px #000000;
  -webkit-box-shadow: -4px 10px 40px #000000;
  box-shadow: -4px 10px 40px #000000;
}

#bg_main .head_title {
  padding-top:5%;
  color:#FFF;
  font-family: 'FC Crayon Regular';
  font-size:34px;
  line-height: 50px;
  text-align: center;
  font-weight: bold;
}

#bg_main .head_sub {
  font-size: 34px;
  color:#FFF;
  line-height: 40px;
  margin-top:10px;
  letter-spacing:2px;
  font-weight: bold;
  text-align: center;
}

#bg_main .head_detail {
  font-size: 16px;
  color:#333;
}

.main_box_rice {
  margin-top: 50px;
}

.rice_dish {
  overflow: hidden;
  text-align: center;
}

.rice_dish img {
  width: 30%;
}

.product_box{
  /*background: url("../images/bg_product.png") repeat-x;*/
  background-color:#FFF;
  /*cursor: pointer;*/
  border:solid 2px #333;
  width:100%;
  min-height:300px;
  margin-top:2%;
  margin-bottom:2%;
  overflow:hidden;
}

.product_box .rice_title, #rice_1 .rice_title, #rice_2 .rice_title, #rice_3 .rice_title, #rice_4 .rice_title {
  font-size: 35px;
  font-weight: bold;
  color: #ffd942;
  text-align: center;
}

.product_box .rice_title img, #rice_1 .rice_title img, #rice_2 .rice_title img, #rice_3 .rice_title img, #rice_4 .rice_title img {
  width: 100%;
}

.product_box .rice_subtitle, #rice_1 .rice_subtitle, #rice_2 .rice_subtitle, #rice_3 .rice_subtitle, #rice_4 .rice_subtitle {
  color: #ffd742;
  text-align: center;
  font-size: 24px;
}

.product_box .rice_provicen, #rice_1 .rice_provicen, #rice_2 .rice_provicen, #rice_3 .rice_provicen, #rice_4 .rice_provicen {
  font-size: 28px;
  font-weight: bold;
  background: #c7a900;
  color: #000;
  text-align: center;
}

.product_box .rice_type, #rice_1 .rice_type, #rice_2 .rice_type, #rice_3 .rice_type, #rice_4 .rice_type {
  color: #ffd742;
  text-align: center;
  font-size: 25px;
}

.product_box .rice_detail, #rice_1 .rice_detail, #rice_2 .rice_detail, #rice_3 .rice_detail, #rice_4 .rice_detail {
  padding-top: 10px;
  color: #fff;
  font-size: 20px;
}


#rice_1 {
  /*background: #ff7e2e;*/
  margin-top: 80px;
  background: #ff7e2e;
  background: -moz-linear-gradient(top, #ff7e2e 75%, #ffffff 100%);
  background: -webkit-linear-gradient(top, #ff7e2e 75%, #ffffff 100%);
  background: linear-gradient(to bottom, #ff7e2e 75%, #ffffff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7e2e', endColorstr='#ffffff',GradientType=0 );
}

#rice_2 {
  /*background: #006738;*/
  margin-top: 30px;
  background: #006738;
  background: -moz-linear-gradient(top, #006738 75%, #ffffff 100%);
  background: -webkit-linear-gradient(top, #006738 75%, #ffffff 100%);
  background: linear-gradient(to bottom, #006738 75%, #ffffff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006738', endColorstr='#ffffff',GradientType=0 );
}

#rice_3 {
  /*background: #f54b7f;*/
  margin-top: 60px;
  background: #f54b7f;
  background: -moz-linear-gradient(top, #f54b7f 75%, #ffffff 100%);
  background: -webkit-linear-gradient(top, #f54b7f 75%, #ffffff 100%);
  background: linear-gradient(to bottom, #f54b7f 75%, #ffffff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f54b7f', endColorstr='#ffffff',GradientType=0 );
}

#rice_4 {
  /*background: #b5008c;*/
  background: #b5008c;
  background: -moz-linear-gradient(top, #b5008c 75%, #ffffff 100%);
  background: -webkit-linear-gradient(top, #b5008c 75%, #ffffff 100%);
  background: linear-gradient(to bottom, #b5008c 75%, #ffffff 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5008c', endColorstr='#ffffff',GradientType=0 );
}

.video_rice {
  padding-top: 5%;
}

#rice_green {
  position: relative;
  height: 420px;
  overflow: hidden;
  margin-top: -10%;
}

.rice_btn {
  text-align: center;
  padding-top: 20px;
}

.rice_btn button.btn {
	background-color:#682b5d;
  color: #FFF;
  font-size: 18px;
  padding: 5px;
  text-align: center;
  /*width: 210px;
  background: url("../images/btn.jpg") no-repeat;*/
}


footer {
  background: #ffffff;
  color: #000;
  overflow: hidden;
}

footer #shop_now {
  padding: 2%;
}

footer #shop_now .shop_now .img_shop_now {
  width: 100%;
}

footer #shop_now .shop_now .title {
  padding-top: 10%;
  color: #01965e;
  text-align: center;
  font-size: 3em;
  line-height: 1em;
}

footer #shop_now .shop_now .sud_title {
  color: #01965e;
  text-align: center;
  font-size: 2em;
}

footer #shop_now .shop_now .btn-shop_now {
  background: #ec1d23;
  text-align: center;
  border-radius: 28px;
  padding: 3px 25px 3px 25px;
  border: solid #ec1d23 1px;
  text-decoration: none;
  cursor: pointer;
  width: 200px;
  color: #fff;
  font-size: 25px;
}

footer #copyright {
  background: #4c3a26;
  height:auto;
  text-align: center;
  color: #fff;
  padding: 10px;
  font-size: 16px;
  overflow:hidden;
}
#top{
background-color:#ffc140;
width:100%;
padding:10px;
height:auto;
overflow:hidden;
border:solid 0px #DDD;
margin:0 auto;
z-index:1200;
box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.3);
}

.modal-body {
  font-size: 20px;
}

.my-cart{
background-color:#333;
float:left;
position:fixed;
position:relative;
padding:13px;
font-size:15px;
color:#fec03f;
left: 0%;
z-index:15;
overflow:hidden;
}

.my-cart a{color:#FFF;}

#bg_mycart{
	width:100%;
	position:absolute;
	min-height:40px;
	background-color:#FFF;
	padding:15px;
	margin:0 auto;
	border:solid 1px #FFF;
	/*Shadow*/
   -moz-box-shadow: 5px 5px 5px #000;  
   -webkit-box-shadow: 5px 5px 5px #000;  
    box-shadow: 5px 5px 5px #000; 
}
.bg_full_select {
	background-color: #fffdf1; /* Black background color */
	background-size:100%;
    width: 100%; /* Full width */
	border-bottom:solid 0px #fff;
	overflow:hidden;
}

.bg_full_screen1 {
	position:fixed;
    background-color: #fffdf1; /* Black background color */
    width: 100%;
	border-bottom:solid 0px #fff;
	z-index:10;
	overflow:hidden;
	/*box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.3);*/
}
.bg_full_screen2 {
	/*background: url("../images/bg_head.png") no-repeat;*/
	background-size:100%;
    width: 100%; /* Full width */
	height:100%;
	margin-top:9%;
	position:relative;
	border-bottom:solid 0px #f00;
	overflow:hidden;
}

.bg_full_screen3 {
	background: url("../images/bg_foottage.png") no-repeat;
	background-size:100%;
    width: 100%; /* Full width */
	border-bottom:solid 0px #fff;
	overflow:hidden;
}
@media (max-width: 767px) {
.cate_col{
   width:30%;
   padding:1%;
}
}
@media (min-width: 768px) {
.cate_col{
	width:30%;
	padding:1%;
}
}

@media (max-width: 767px) {
.clear_col{
	background-color:#f6ecc9;
	padding-top:11%;
}
}
@media (min-width: 768px) {
.clear_col{
	background-color:#f6ecc9;
	padding-top:9%;
}
}

@media (max-width: 767px) {
.head_title_col{
  font-size:5vw;
  text-align:center;
  padding:1%;
}
}
@media (min-width: 768px) {
.head_title_col{
  font-size:3vw;
  text-align:center;
  padding:1%;
}
}

@media (max-width: 767px) {
.area_info{
	font-size:3vw;
	margin-bottom:30%;
	text-align:center;
	overflow:hidden;
}
}
@media (min-width: 768px) {
.area_info{
	font-size:2vw;
	padding:5%;
	margin-bottom:70%;
	overflow:hidden;
}
}

.bg_cont {
	background: url("../images/bg_cont.png") no-repeat;
	background-color: #fffdf1; 
	background-size:100%;
    width: 100%; /* Full width */
	height:100%;
	border-bottom:solid 0px #f00;
	overflow:hidden;
}

.bg_full_area_p_reco{
	background: url("../images/products.png") no-repeat;
	background-size:100%;
    width: 100%; /* Full width */
	position:relative;
	border-bottom:solid 0px #f00;
	overflow:hidden;
}

.bg_full_area1 {
	background: url("../images/cat_products.png") no-repeat;
	background-size:100%;
    width: 100%; /* Full width */
	position:relative;
	border-bottom:solid 0px #f00;
	overflow:hidden;
}

@media (min-width: 768px) {
.page_number{
	width:30%;
	float:right;
	padding-right:0px;
	margin-right:-4%;
	border:solid 0px #f00;
	overflow:hidden;
	clear:both;
}
.page_number ul{
	margin-right:-30%;
}
.page_number li{
	color:#4c3a26;
	border:#4c3a26 solid 2px;
	text-align:center;
	font-family: 'SukhumvitSetBold';
	padding:3%;
	width:12%;
	float:left;
	margin-right:2%;
	border-radius:15%;
	overflow:hidden;
}
}

@media (max-width: 767px) {
.page_number{
	width:50%;
	float:right;
	padding-right:0px;
	border:solid 0px #f00;
	overflow:hidden;
	clear:both;
}
.page_number ul{
	margin-right:-30%;
}
.page_number li{
	color:#4c3a26;
	border:#4c3a26 solid 1px;
	text-align:center;
	font-family: 'SukhumvitSetBold';
	padding:3%;
	width:15%;
	float:left;
	margin-right:2%;
	border-radius:10%;
	overflow:hidden;
}
}

@media (min-width: 768px) {
.icon_sale{
	position:absolute;
	width:8%;
	margin-left:-2%;
	margin-top:-3%;
}
}
@media (max-width: 767px) {
.icon_sale{
	position:absolute;
	width:15%;
	margin-left:-2%;
	margin-top:-3%;
}
}

@media (min-width: 768px) {
.icon_cart{
	position:relative;
	width:15%;
	buttom:0;
	margin-top:-10%;
	float:right;
}
}
@media (max-width: 767px) {
.icon_cart{
	position:relative;
	width:18%;
	buttom:0;
	margin-top:-12%;
	float:right;
}
}

@media (min-width: 768px) {
.clear_col_bg{
	margin-bottom:26%;
}
}
@media (max-width: 767px) {
.clear_col_bg{
	margin-bottom:23%;
}
}

@media (min-width: 768px) {
.clear_col_bg2{
	margin-bottom:53%;
}
}
@media (max-width: 767px) {
.clear_col_bg2{
	margin-bottom:13.5%;
}
}
.bg_full_area1_2 {
	background: url("../images/goodsaller_products.png") no-repeat;
	background-color: #f6ecc9; 
	background-size:100%;
    width: 100%; /* Full width */
	height:100%;
	border-bottom:solid 0px #f00;
	overflow:hidden;
}
.bg_item{
	border:#F00 solid 0px;
	padding:3%;
}
.item_p{
	background-color: #fff;
	border:#F00 solid 0px;
	height:100%;
	padding:5%;
	border-radius:12%;
	overflow:hidden;
}
.bg_item_detail{
	border:#F00 solid 0px;
	padding:2%;
}
.item_p_detail{
	background-color: #fff;
	border:#F00 solid 0px;
	height:100%;
	padding:2%;
	overflow:hidden;
}
.bg_full_area1_3 {
	background: url("../images/khaokrua.png") no-repeat;
	background-color: #f8f1de; 
	background-size:100%;
	height:100%;
    width: 100%; /* Full width */
	border-bottom:solid 0px #f00;
	overflow:hidden;
}

.our_story {
    background: url("../images/our_story.png") no-repeat;
	background-size:100%;
    width: 35%; /* Full width */
	height:100%;
    right:0;
    position:absolute;
	margin-top:16%;
	margin-right:2%;
	overflow:hidden;
}
.btn1 {
	background: url("../images/btn.png") no-repeat;
	background-size:100%;
	width: 35%; /* Full width */
	height:100%;
	left:0;
	position:absolute;
	margin-top:55%;
	margin-left:10%;
	cursor:pointer;
	z-index:10px;
	overflow:hidden;
}
.btn2 {
	background: url("../images/btn2.png") no-repeat;
	background-size:100%;
	width: 12%; /* Full width */
	height:100%;
	right:0;
	position:absolute;
	margin-top:40%;
	margin-right:5%;
	cursor:pointer;
	z-index:10px;
	overflow:hidden;
}
.btn3 {
	float:right;
}
.btn4 {
	background: url("../images/btn4.png") no-repeat;
	background-size:100%;
	width: 12%; /* Full width */
	height:100%;
	right:0;
	position:absolute;
	margin-top:44%;
	margin-right:5%;
	cursor:pointer;
	z-index:10px;
	overflow:hidden;
}
.col-img {
	background-size:100%;
	width: 100%; /* Full width */
	height:100%;
	margin-top:20%;
	margin-left:20%;
	position:absolute;
	overflow:hidden;
	text-align: center;
}
.img{
	float:left;
}


/*------------------------------------------------------------------------------------------------*/
.link_hover{
  list-style:none;
  width:150px;
}

.link_hover > a{
  background-color:#c070c6;
  padding:5px;
  border-radius: 20px;
  text-decoration:none;
  color:#FFF;
  text-align:center;
  display:block;
  cursor: pointer;
  font-size:18px;
  /* transition */
   -webkit-transition: background-color 0.5s ease-out;
   -moz-transition: background-color 0.5s ease-out;
   -o-transition: background-color 0.5s ease-out;
   transition: background-color 0.5s ease-out;
}

.link_hover > a:hover{
  background-color:#a74dc6;
  color:#fff;
}

.Login_Member{
	background-color:#FFF;
	margin:0 auto;
	min-height:80px;
	overflow:hidden;
	padding:10px;
	margin-top:10px;
	margin-bottom:10px;
	border-radius: 5px 5px 5px 5px;
	border:solid 0px #FFF;
}
.Login_Member ul li{
	background-color:#FFF;
	margin-left:-2%;
	overflow:hidden;
}
#login{
background:#ffc140;
position:fixed;
font-size:24px;
padding: 1%;
color:#FFF;
left: 0%;
top: 0;
margin-right:10px;
z-index:20;
overflow:hidden;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.3);
}
#login a{
	width:auto;
    /*margin-top:30px;*/
	font-size:13px;
	text-decoration:none;
	color:#000;
}
/*------------------------------------------------------------------------------------------------*/


.bg_cont1{
	background-color:#c5c5c5;
	overflow:hidden;
}

.cont1{
	background-color:#ffc140;
	/*width:1168px;*/
	min-height:327px;
	padding:5px;
	overflow:hidden;
	font-size:22px;
	margin-left:4px;
	margin-top:20px;
	float:left;
	border:solid 0px #FFF;
	border-radius: 8px;
	/*box-shadow: 0px 0px 2px 2px rgba(0, 0, 0, 0.1);*/
}
.cont1 ul li{
	margin-top:10px;
	list-style:none;
}
.cont1 ul li td{
	font-size:22px;
	color:#FFF;
}

.Frame_address{
	background-color:#ffc140;
	/*background-repeat:repeat;*/
    width:auto;
    min-height:50px;
    font-size:18px;
	padding:5px;
    overflow:hidden;
	float:left;
	/*border:#132867 1px solid;*/
	margin-bottom:20px;
	margin-left:10px;
	margin-top:10px;
	border-radius: 8px;
}
#logo_address{
 float:left;
}
#text_address{
	/*background-color:#f5f5f5;*/
	padding:10px;
	float:left;
	font-size:18px;
	color:#FFF;
	border:#FFF 0px solid;
}

/*animation*/
.tree2 {
  animation: tree2 ease-in 25s;
  animation-iteration-count: infinite;
  transform-origin: 50% 50%;
  -webkit-animation: tree2 ease-in 25s;
  -webkit-animation-iteration-count: infinite;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: tree2 ease-in 25s;
  -moz-animation-iteration-count: infinite;
  -moz-transform-origin: 50% 50%;
  -o-animation: tree2 ease-in 25s;
  -o-animation-iteration-count: infinite;
  -o-transform-origin: 50% 50%;
  -ms-animation: tree2 ease-in 25s;
  -ms-animation-iteration-count: infinite;
  -ms-transform-origin: 50% 50%;
}


@keyframes tree2 {
  0% {
    transform: translate(0px, 0px);
  }
  10% {
    transform: translate(-10px, 0px);
  }
  20% {
    transform: translate(10px, 0px);
  }
  30% {
    transform: translate(-10px, 0px);
  }
  40% {
    transform: translate(10px, 0px);
  }
  50% {
    transform: translate(-10px, 0px);
  }
  60% {
    transform: translate(10px, 0px);
  }
  70% {
    transform: translate(-10px, 0px);
  }
  80% {
    transform: translate(10px, 0px);
  }
  90% {
    transform: translate(-10px, 0px);
  }
  100% {
    transform: translate(0px, 0px);
  }
}

@-moz-keyframes tree2 {
  0% {
    -moz-transform: translate(0px, 0px);
  }
  10% {
    -moz-transform: translate(-10px, 0px);
  }
  20% {
    -moz-transform: translate(10px, 0px);
  }
  30% {
    -moz-transform: translate(-10px, 0px);
  }
  40% {
    -moz-transform: translate(10px, 0px);
  }
  50% {
    -moz-transform: translate(-10px, 0px);
  }
  60% {
    -moz-transform: translate(10px, 0px);
  }
  70% {
    -moz-transform: translate(-10px, 0px);
  }
  80% {
    -moz-transform: translate(10px, 0px);
  }
  90% {
    -moz-transform: translate(-10px, 0px);
  }
  100% {
    -moz-transform: translate(0px, 0px);
  }
}

@-webkit-keyframes tree2 {
  0% {
    -webkit-transform: translate(0px, 0px);
  }
  10% {
    -webkit-transform: translate(-10px, 0px);
  }
  20% {
    -webkit-transform: translate(10px, 0px);
  }
  30% {
    -webkit-transform: translate(-10px, 0px);
  }
  40% {
    -webkit-transform: translate(10px, 0px);
  }
  50% {
    -webkit-transform: translate(-10px, 0px);
  }
  60% {
    -webkit-transform: translate(10px, 0px);
  }
  70% {
    -webkit-transform: translate(-10px, 0px);
  }
  80% {
    -webkit-transform: translate(10px, 0px);
  }
  90% {
    -webkit-transform: translate(-10px, 0px);
  }
  100% {
    -webkit-transform: translate(0px, 0px);
  }
}

@-o-keyframes tree2 {
  0% {
    -o-transform: translate(0px, 0px);
  }
  10% {
    -o-transform: translate(-10px, 0px);
  }
  20% {
    -o-transform: translate(10px, 0px);
  }
  30% {
    -o-transform: translate(-10px, 0px);
  }
  40% {
    -o-transform: translate(10px, 0px);
  }
  50% {
    -o-transform: translate(-10px, 0px);
  }
  60% {
    -o-transform: translate(10px, 0px);
  }
  70% {
    -o-transform: translate(-10px, 0px);
  }
  80% {
    -o-transform: translate(10px, 0px);
  }
  90% {
    -o-transform: translate(-10px, 0px);
  }
  100% {
    -o-transform: translate(0px, 0px);
  }
}

@-ms-keyframes tree2 {
  0% {
    -ms-transform: translate(0px, 0px);
  }
  10% {
    -ms-transform: translate(-10px, 0px);
  }
  20% {
    -ms-transform: translate(10px, 0px);
  }
  30% {
    -ms-transform: translate(-10px, 0px);
  }
  40% {
    -ms-transform: translate(10px, 0px);
  }
  50% {
    -ms-transform: translate(-10px, 0px);
  }
  60% {
    -ms-transform: translate(10px, 0px);
  }
  70% {
    -ms-transform: translate(-10px, 0px);
  }
  80% {
    -ms-transform: translate(10px, 0px);
  }
  90% {
    -ms-transform: translate(-10px, 0px);
  }
  100% {
    -ms-transform: translate(0px, 0px);
  }
}

/** tree1 **/
.tree1 {
  animation: tree1 ease-in 30s;
  animation-iteration-count: infinite;
  transform-origin: 50% 50%;
  -webkit-animation: tree1 ease-in 30s;
  -webkit-animation-iteration-count: infinite;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: tree1 ease-in 30s;
  -moz-animation-iteration-count: infinite;
  -moz-transform-origin: 50% 50%;
  -o-animation: tree1 ease-in 30s;
  -o-animation-iteration-count: infinite;
  -o-transform-origin: 50% 50%;
  -ms-animation: tree1 ease-in 30s;
  -ms-animation-iteration-count: infinite;
  -ms-transform-origin: 50% 50%;
}

@keyframes tree1 {
  0% {
    transform: translate(0px, 0px);
  }
  10% {
    transform: translate(-10px, 0px);
  }
  20% {
    transform: translate(10px, 0px);
  }
  30% {
    transform: translate(-10px, 0px);
  }
  40% {
    transform: translate(10px, 0px);
  }
  50% {
    transform: translate(-10px, 0px);
  }
  60% {
    transform: translate(10px, 0px);
  }
  70% {
    transform: translate(-10px, 0px);
  }
  80% {
    transform: translate(10px, 0px);
  }
  90% {
    transform: translate(-10px, 0px);
  }
  100% {
    transform: translate(0px, 0px);
  }
}

@-moz-keyframes tree1 {
  0% {
    -moz-transform: translate(0px, 0px);
  }
  10% {
    -moz-transform: translate(-10px, 0px);
  }
  20% {
    -moz-transform: translate(10px, 0px);
  }
  30% {
    -moz-transform: translate(-10px, 0px);
  }
  40% {
    -moz-transform: translate(10px, 0px);
  }
  50% {
    -moz-transform: translate(-10px, 0px);
  }
  60% {
    -moz-transform: translate(10px, 0px);
  }
  70% {
    -moz-transform: translate(-10px, 0px);
  }
  80% {
    -moz-transform: translate(10px, 0px);
  }
  90% {
    -moz-transform: translate(-10px, 0px);
  }
  100% {
    -moz-transform: translate(0px, 0px);
  }
}

@-webkit-keyframes tree1 {
  0% {
    -webkit-transform: translate(0px, 0px);
  }
  10% {
    -webkit-transform: translate(-10px, 0px);
  }
  20% {
    -webkit-transform: translate(10px, 0px);
  }
  30% {
    -webkit-transform: translate(-10px, 0px);
  }
  40% {
    -webkit-transform: translate(10px, 0px);
  }
  50% {
    -webkit-transform: translate(-10px, 0px);
  }
  60% {
    -webkit-transform: translate(10px, 0px);
  }
  70% {
    -webkit-transform: translate(-10px, 0px);
  }
  80% {
    -webkit-transform: translate(10px, 0px);
  }
  90% {
    -webkit-transform: translate(-10px, 0px);
  }
  100% {
    -webkit-transform: translate(0px, 0px);
  }
}

@-o-keyframes tree1 {
  0% {
    -o-transform: translate(0px, 0px);
  }
  10% {
    -o-transform: translate(-10px, 0px);
  }
  20% {
    -o-transform: translate(10px, 0px);
  }
  30% {
    -o-transform: translate(-10px, 0px);
  }
  40% {
    -o-transform: translate(10px, 0px);
  }
  50% {
    -o-transform: translate(-10px, 0px);
  }
  60% {
    -o-transform: translate(10px, 0px);
  }
  70% {
    -o-transform: translate(-10px, 0px);
  }
  80% {
    -o-transform: translate(10px, 0px);
  }
  90% {
    -o-transform: translate(-10px, 0px);
  }
  100% {
    -o-transform: translate(0px, 0px);
  }
}

@-ms-keyframes tree1 {
  0% {
    -ms-transform: translate(0px, 0px);
  }
  10% {
    -ms-transform: translate(-10px, 0px);
  }
  20% {
    -ms-transform: translate(10px, 0px);
  }
  30% {
    -ms-transform: translate(-10px, 0px);
  }
  40% {
    -ms-transform: translate(10px, 0px);
  }
  50% {
    -ms-transform: translate(-10px, 0px);
  }
  60% {
    -ms-transform: translate(10px, 0px);
  }
  70% {
    -ms-transform: translate(-10px, 0px);
  }
  80% {
    -ms-transform: translate(10px, 0px);
  }
  90% {
    -ms-transform: translate(-10px, 0px);
  }
  100% {
    -ms-transform: translate(0px, 0px);
  }
}

.img_banner_footer_m {
  width: 100%;
  display: none;
}

.img_banner_footer {
  width: 100%;
  display: block;
}

.logo {
  display: inline !important;
}

@media (min-width: 768px) {
  .logo_web{
  width:30%;
  }
}
@media (max-width: 767px) {
  .logo_web{
  width:50%;
  }
}
@media (max-width: 300px) {
  .logo_web{
  width:70%;
  }
}