﻿@charset "utf-8";
/* Set Short Code */
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.opa0 {
  opacity: 0;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  transition: all 0.2s linear;
}
.opa1 {
  opacity: 1;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
  -o-transition: all 0.5s linear;
  -ms-transition: all 0.5s linear;
  transition: all 0.5s linear;
}
.exborder {
  border: 1px solid red;
  color: red;
}

/*html {
-moz-filter: grayscale(100%);
-webkit-filter: grayscale(100%);
filter: gray;
filter: grayscale(100%);
}
*/

/* Add font */

@font-face {
  font-family: 'thaisanslite';
  src: url('../font/thaisanslite/thaisanslite.eot');
  src: url('../font/thaisanslite/thaisanslite.eot') format('embedded-opentype'), url('../font/thaisanslite/thaisanslite.woff') format('woff'), url('../font/thaisanslite/thaisanslite.ttf') format('truetype'), url('../font/thaisanslite/thaisanslite.svg#thaisanslite') format('svg');
}
@font-face {
    font-family: 'thaisans_neueregular';
    src: url('../font/ThaiSans Neue/thaisansneue-regular-webfont.eot');
    src: url('../font/ThaiSans Neue/thaisansneue-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/ThaiSans Neue/thaisansneue-regular-webfont.woff') format('woff'),
         url('../font/ThaiSans Neue/thaisansneue-regular-webfont.ttf') format('truetype'),
         url('../font/ThaiSans Neue/thaisansneue-regular-webfont.svg#thaisans_neueregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'dsn_katreeyaregular';
    src: url('../font/dsn katreeya/dsnkat_-webfont.eot');
    src: url('../font/dsn katreeya/dsnkat_-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/dsn katreeya/dsnkat_-webfont.woff2') format('woff2'),
         url('../font/dsn katreeya/dsnkat_-webfont.woff') format('woff'),
         url('../font/dsn katreeya/dsnkat_-webfont.ttf') format('truetype'),
         url('../font/dsn katreeya/dsnkat_-webfont.svg#dsn_katreeyaregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'th_sarabunpskregular';
    src: url('../font/THsarabun/thsarabun-webfont.eot');
    src: url('../font/THsarabun/thsarabun-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/THsarabun/thsarabun-webfont.woff2') format('woff2'),
         url('../font/THsarabun/thsarabun-webfont.woff') format('woff'),
         url('../font/THsarabun/thsarabun-webfont.ttf') format('truetype'),
         url('../font/THsarabun/thsarabun-webfont.svg#th_sarabunpskregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
  font-family: 'THSarabunIT๙';
  src: url('../font/THSarabunIT๙.ttf');
  unicode-range: U+0E00–U+0E7F;
}

.fontTs {
  font-family: 'thaisanslite';
  font-size: 0.9em;
}
.fontTsn {
  font-family: 'thaisans_neueregular';
  font-size: 1.0em;
}
.tahoma {
  font-family: tahoma;
}
.font13 {
  font-size: 1.3em;
}
.dashboard_text{
	font-family: 'dsn_katreeyaregular';		
}
.dashboard{
	font-family: 'dsn_katreeyaregular';	
	font-size:3em;
	color:#69f900;
}
.main_color {
  color: #f5f8fb;
}
.link_color {
  color: #FFFFFF;
}
.link_color:hover {
  color: #FF0000;
}
.text_center{
	text-align:center;	
}
a {
  color:#666666;
  text-decoration: none;
}
a:hover{
  color:#F00;
}
.left {
  float: left;
}
.right {
  float: right;
}
.center {
  margin: 0 auto 0 auto;
  display: block;
  text-align:center;
}
img {
  /*max-width: 100%;*/
  height: auto;
}
h1{
  font-size: 1.4em;
  color:rgb(49, 44, 44);  
}
h2{
  font-size: 1.6em;
  color:#FFF;
}
.box_h1{
	float:left;
	width:100%;
	height:auto;
	padding: 15px 0 5px 0;
	clear:both;
	border-bottom:2px solid #007bff;
	margin-bottom:15px;
	
}
ul li a{
	color:#FFF;	
}
ul.stadium_li li{
	list-style-image:url(../grocery_crud/themes/flexigrid/css/images/001_20.png);	
}
ul.twin_li li{
	list-style-image:url(../grocery_crud/themes/flexigrid/css/images/next.gif);	
	list-style-position:inside;
}
ul.uupdate_li li{
	list-style-image:url(../grocery_crud/themes/flexigrid/css/images/red.png);	
}

body {
  width: 100%;
  text-align: center;
  font-family: tahoma , serif;
  font-size: 0.9em;
  font-family: 'thaisanslite';
}

.warpper {
  max-width: 1250px;
  text-align: left;
  position: relative;
  margin:0 auto;
}
.outlineContainer {
  width: 100%;
  position: relative;
  height: auto;
  margin: 0 auto;
  font-family: Arial;
}
.head_box{
	float:left;
	width:100%;
	height: 350px;	
	background:url(../img/header.jpg) no-repeat top center;
	background-size: 100% 350px;
	/*position: fixed;*/
    z-index: 1;
}
.main_logo {
  width:40%;  
  float: left;
  font-size:3em;
  color:#FFF;
  margin:30px -10px 0;
  text-align:center;
  z-index: 2;
  position: relative;
}
.head_contact{
	float:right;
	max-width:50%;
	height:auto;
	color:#FFF;
	font-size:1.4em;
	line-height: 1.3em;
	margin:40px 0 0;
}
.header_title{
	float:left;
	width:70%;
	height:100%;
	font-size: 3.0em;
    color: white;
    padding: 4% 0 0;
	font-weight: bold;
    letter-spacing: 1px;	
}
.short_title{
	margin:0 auto;
	width:95%;
	height:auto;	
	background:url(../img/title-short-bg2.png) no-repeat top center #999;
	border-radius: 5px;
}
.long_title{
	width:100%;
	height:45px;	
	background:url(../img/title-bg.png) no-repeat top center #999;
	border-radius: 5px;
	padding: 0px 15px 0;
}

.text_title{
	float:left;
	width:100%;
	font-size: 1.0em;
	line-height: 1.2em;
    color: white;	
	font-weight: bold;
    letter-spacing: 1px;
	padding: 0px 15px 5px;
}

.content_warpper {
  width: 100%;
  float: left;
  height: auto;
  min-height: 200px;
  font-size: 1.6em;
  margin-top:65px;
  /*background:#FFF;
  position: relative;
  box-shadow: 0px 0px 15px #888888;*/
}
.main_content {
	float:left;
	width:100%;
	min-height:250px;
  	line-height: 26px;
  	text-align: left;
  	word-wrap:break-word;
  	padding:20px 15px 20px 15px;
  	border:0px solid #F90;
}
.left_content {
	float:right;
	width:20%;
  	font-size: 1.3em;
  	line-height: 26px;
  	text-align: left;
  	word-wrap:break-word;
  	padding-top: 10px;
	background:#4d2b09;
}
.course_bg {
	float:left;
	width: 100%;
	height: auto;
	background:url(../img/food-menu-bg.png);
	background-size:100% 100%;
}
.menu_bg {
	float:left;
	width: 100%;
	height: auto;
	background:url(../img/food-menu-bg.png);
	background-size: 136%;
}
.activity_bg {
	float:left;
	width: 100%;
	height: 365px;
	background:url(../img/activity-bg.png);
	margin-top: -3px;
}
.box_slide{
	width:100%;
	height:400px;
	overflow:hidden;	
}

.main_slide{
	max-height:700px;
	overflow:hidden;	
}
.welcom_img{
	padding:0 20px 0;	
}

.booking_button{
	float:left;
	width:100%;
	text-align:center;
	clear:both;
	margin:5px 0px 10px;
}
.booking_button:hover{
	opacity:0.8;	
}

.member_menu{
	width: 100%;
	height:auto;	
}
a li:hover {
	color:#F00;	
}
.menu_group {
  background: #000;
  width: 100%;
  height: 28px;
  margin: auto;
  color: #FFFFFF;
  padding-left: 10px;
  font-weight: bold;
  list-style: none;
}
li.button {
  margin: 2px 0 2px 0;
  background: url(../img/bg_sub_head.png) no-repeat center;
  width: 100%;
  list-style: none;
}
li.button a {
  display: block;
  list-style: none;
  height: 30px;
  color: #5f5454;
  font-weight: bold;
  font-size: 1.0em;
  overflow: hidden;
  padding: 0 0 0 10px; 
  position: relative;
  width: 182px;
  text-decoration: none;
  margin-bottom: -5px;
}
li.button a:hover {
	color:#0071B3;
}
li.menu_active a {
	color:#F10691;
}
/*.standdard_tb{
	border:0px solid #CCC;	
}
.standdard_tb tr{
	border-top: 1px solid #ddd;	
}
.standdard_tb th, .standdard_tb td{
	padding: 5px;
}
.standdard_tb .non_top_line{
	border-top: 0px solid #ddd;		
}*/

.standdard_tb{
	border:0px solid #CCC;	
	font-family: 'th_sarabunpskregular';
}
#lp_font{
	font-family: 'THSarabunIT๙';
	font-size:1.2em;
}
#lp_head{
	border:1px solid #000000;	
}
#lp_detail{
	border-bottom:1px dashed #000000;	
}
.standdard_tb tr{
	border-top: 0px solid #ddd;	
}
.standdard_tb th{
	padding: 5px;
	border: 1px solid #000000;
}
.standdard_tb td{
	padding: 5px;
	border-left: 1px solid #000000;
	border-right: 1px solid #000000;
}
.standdard_tb .non_top_line{
	border-left: 0px solid #000000;	
	border-right: 0px solid #000000;	
}
.standdard_tb .non_top_line td{
	border-left: 0px solid #000000;	
	border-right: 0px solid #000000; /*#B6B5B5*/	
}

.standdard_tb_print{
	border:0px solid #000;	
	font-family: 'th_sarabunpskregular';
}
.standdard_tb_print tr{
	border-top: 0px solid #ddd;	
}
.standdard_tb_print th{
	padding: 4px;
	border: 1px solid #000000;
}
.standdard_tb_print td{
	padding: 3px;
	border-left: 1px solid #000000;
	border-right: 1px solid #000000;
}
.standdard_tb_print .non_top_line{
	border-left: 0px solid #000000;	
	border-right: 0px solid #000000;	
}
.standdard_tb_print .non_top_line td{
	border-left: 0px solid #000000;	
	border-right: 0px solid #000000;	
}

.mainmenu-md {
  width: 100%;
  height: 64px;
  float: right;
  z-index: 1;
  background:#070764;
  position: absolute;
  margin-top: 350px;
}
nav.menu {
  width: 76%;
  float: right;
  font-size: 1.6em;
}
nav.menu li {
  float: left;
  width: auto;  
  height: 41px;
  /*background:url(../img/menu-bg.png) no-repeat;*/
  margin: 12px 0px 0;
  padding: 6px 20px 0px 20px;
  text-align: center;
}
nav.menu li a {
  text-transform:uppercase;
  font-size: 0.9em; 
}
nav.menu li:hover{
	background:url(../img/menu-hover.png);	
	border-radius:15px;
}
nav.menu li a:hover {
	color: #F00;
}

nav.menu li:hover .sub_menu{
	display:block;
	/*background:url(../img/menu-hover.png);*/
}
.sub_menu{
    float: left;
	display: none;
    width: 250px;
    list-style: none;
    margin: 13px -24px 0;
    background: url(../img/menu-bg2.png) center;
	border-radius: 15px 15px 15px 15px;
}

/*  เมนู สำหรับมือถือ  */
.main_logo_xs{
	float:left;
	width:100%;
	font-size:2em;
	font-weight:bold;
	text-align:center;
}
.main_logo_xs img{
	max-width:160px;	
}

.mainmenu-xs {
  width: 100%;
  height: 120px;;
  position:relative;
  background: url(../img/header.jpg) center;
	 background-size:100% 120px;
}
.menu-xs {
  float: left;
  cursor: pointer;
  background: url(../img/ico_submenu.png) no-repeat center center;
  width: 80px;
  height: 50px;
  position: relative;
  z-index: 1000;
  border-radius: 10px;
      top: 120px;
}

.submenu-xs {
  width: 50%;
  float: left;
  position: relative;
  z-index: 1000;
  display: none;
  font-weight: normal;
  margin-top: 115px;
  border-radius:5px;
}
.submenu-xs li {
  float: left;
  width: 100%;
  height: 45px;
  background:#FFFFFF;
  padding: 10px 0px 12px 20px;
  text-align: left;
  font-size:1.4em;
  border-radius:5px;
}
/*.submenu-xs li:hover {
  background: #eeeeee;
  color:#282828;
}*/
.submenu-xs li a {
  color: #070764;
}
.submenu-xs li a:hover {
  color: #000000;
}

.submenu-xs .show_sub a{
	cursor:not-allowed;	
}
.submenu-xs .show_sub:hover .sub_menu{
	display:block;
}
.submenu-xs .sub_menu{
	float:left;
	display:none;
	width: 133px;
	height: 72px;
	background:none;
	border-radius: 7px;
	margin: -25px 0px 0px 100%;
}
.submenu-xs .sub_menu li {
  float: left;
  width: 130px;
  height: 36px;
  list-style:none;
  padding: 3px 0px 0px 0px;
  text-align: center;
  margin:0px 0px 0px 0px;
  border:none;
}
.submenu-xs .sub_menu li a {
  font-size:0.7em;
  color: #ffffff;
  cursor:pointer;
}
.submenu-xs .sub_menu li:hover {
	text-decoration:underline;
}


.regist-btn{
	opacity:0.8;
}
.regist-btn:hover{
	opacity:1.0;
}

#formlogin td{
	width: 65px;	
}
#formlogin input[type=text],#formlogin input[type=password]{
	width: 105px;
	border:1px solid #c5ddf3;
	padding-top: 0px;
	padding-bottom: 3px;
	border-radius:5px;
}
#formlogin input[type=submit]{
	width:117px;
	height:38px;
	background:url(../img/login-btn.png) no-repeat;
	color:#FFF;
	cursor:pointer;
	margin:20px 0 0 0;
	border:none;
}
#formlogin input[type=submit]:hover{
	color:#FF0000;	
	background:url(../img/login-btn-h.png) no-repeat;
}

#form_contact input[type=text],#form_contact input[type=password],#form_contact input[type=number],#form_contact textarea,#form_contact select{
	width: 90%;
	border:1px solid #c5ddf3;
	padding-top: 6px;
	padding-bottom: 5px;
    margin: 10px 0 10px;
	border-radius:4px;
}
#form_contact #capt{
	width: 110px;	
}
#form_contact input[type=submit],#form_contact input[type=reset]{
	width:150px;
	height:58px;
	background:#007bff;
	background-size:contain;
	color:#FFF;
	cursor:pointer;
	margin:20px 0 20px 0;
	border:none;
	border-radius:5px;
}
#form_contact input[type=submit]:hover,#form_contact input[type=reset]:hover{
	color:#070764;	
	opacity: 0.8;
}

.add_student{
	width: 50%;
  	margin: 0 auto;
}



.footer {
  width: 100%;
  height: auto;
  float: left;
  position:relative;
  background:#070764;
  font-size: 1.2em;
  color: #95894d; /*#524d4d*/
  padding-top:9px;
  line-height:24px;
  overflow:hidden;
}
.footer .foot_tel{
	font-size:20px;
}
.footer .copy-right{
}

.footer-mb {
  width: 100%;
  float: left;
  background: #070764;
  font-size: 1.0em;
  color: #f1f1f1;
}
.footer-mb .foot-open {
  padding: 10px;
  text-align: left;
}
.footer-mb .foot-credit {
  width: 100%;
  /*background-color: #999999;*/
  color: #ffffff;
  text-align: center;
}
.footer-mb .foot-social {
  text-align: center;
  padding-top: 2px;
}
.footer-mb .foot-social img {
	margin:7px 3px 5px 3px;
}
.footer-mb .foot-social img:hover {
  opacity: 0.8;
}
.footer-mb .copy-right {
  float: left;
  width: 100%;
  height:auto;
  /*background-color: #292929!important;*/
  color: #FFFFFF;
  text-align:center;
  line-height: 22px;
  
}

.icon_facebook{
	float:left;
	width:30px;
	height:30px;
	background:url(../img/icon/all-icon-social2.png) no-repeat;
	background-position:-26px -2px;	
	background-size:160px;
}
.icon_facebook:hover{
	opacity:0.8;	
}
.icon_line{
	float:left;
	width:30px;
	height:30px;
	background:url(../img/icon/line-icon.png) no-repeat;	
	background-size:30px;
}
.icon_line:hover{
	opacity:0.8;	
}
.icon_whatapp{
	float:left;
	width:30px;
	height:30px;
	background:url(../img/icon/WhatsApp_icon.png) no-repeat;	
	background-size:30px;
}
.icon_whatapp:hover{
	opacity:0.8;	
}
.icon_youtube{
	float:left;
	width:30px;
	height:30px;
	background:url(../img/icon/all-icon-social2.png) no-repeat;
	background-position:-63px -2px;	
	background-size:160px;
}
.icon_youtube:hover{
	opacity:0.8;	
}

.footer_menu li{
	list-style:none;
	padding: 9px;
}
.footer_menu li a{
	font-size:1.4em;
	color:#f1f1f1;
}
.footer_menu li a:hover{
	color:#CCCCCC;
}

.about_ck {
  float: left;
  width: 100%;
  padding: 30px 10px 30px 10px;
  padding-top: 0px;
  position: relative;
  padding-bottom: 40px;
  color: #282828;
}
.slide-mobile{
  float: left;
  display: block;
  height: 160px;
  margin-left: auto;
  margin-right: auto;
  max-width: 1360px;
  margin-top:40px;
  /*position:absolute;*/
}

.box_content{
	float:left;
	display:block;
	width:100%;
	height:auto;
	margin:0 auto;
	/*color:#7DF900;
	border-bottom:20px solid #6A3D9A;
	border-left:5px solid #6A3D9A;
	border-right:5px solid #6A3D9A;*/
	border-radius:5px;
}

.button1{
	width:300px;
	height:65px;
	margin: 0 auto;
	color:#FFF;
	padding-top:5px;
	background:url(../img/kayu-clipart.png) no-repeat;
	background-position:0px -58px;
	margin-top: 12px;	
	background-size: 30%;
}
.product_item{
	float: left;
	display:block;
	width: 200px;
	height: 260px;
	text-align:left;
	padding-left:3px;
	margin:0px 22px 20px 0px;
}
.product_img{
	float: left;
	display:block;
	width: 200px;
	height: 175px;
	background:url(../img/product-item-bg.png) no-repeat;
	margin-left: -5px;
	padding: 9px 0px 0px 12px;
}
.product_img img{
	max-height:140px;	
}
.box_item_main{
	float:left;
	display:block;
	width:100%;
	height: 170px;
	margin: 5px 0px 5px;
}
.box_item_main .img{
	width:50%;
    overflow: hidden;
	border-radius:3px;
	overflow:hidden;
	border:1px dashed #070764;
}
.box_item_main .text{
	float: right;
	width: 50%;
    height: 101%;
    overflow: hidden;
	color:#fff;
	background: #070764;
    font-size: 1.0em;
	line-height: 1.1em;
	padding: 5px 6px;
	border:1px dashed #070764;
}

.box_item{
	float:left;
	display:block;
	width:375px;
	height: 470px;
	margin: 5px 17px 5px;
}
.box_item .img{
    overflow: hidden;
	border-radius:3px;
	overflow:hidden;
}
.box_item .text{
	width: 269px;
    height: 160px;
    margin: 13px 9px 0;
    overflow: hidden;
	color:#000;
	background: #FFC;
    font-size: 1.4em;
	line-height: 1.1em;
	padding: 0px 6px;
}
.box_item2{
	float:left;
	display:block;
	width:307px;
	height:189px;
	background:url(../img/activity-box.png) no-repeat;
	margin: 30px 9px 0;
}
.box_item2 .img{
	width: 274px;
    height: 154px;
    margin: 13px 15px 0;
    overflow: hidden;
	border-radius:3px;
}
.box_item2H{
	float:left;
	display:block;
	width:307px;
	height:250px;
	background:url(../img/activity-boxH.png) no-repeat;
	margin: 20px 9px 0;
}
.box_item2H .img{
	width: 274px;
    height: 219px;
    margin: 12px 15px 0;
    overflow: hidden;
	border-radius:3px;
}
.box_item3{
	float:left;
	display:block;
	width:295px;
	height:400px;
	/*background:url(../img/course-box.png) no-repeat;
	background-size:100% 98%;*/
	margin: 30px 3px 15px;
	/*padding: 22px 0px 0px 14px;*/
}
.box_item3 .img{
	/*width: 271px;
    height: 178px;
    margin: 5px 1px 0;*/
    overflow: hidden;
	border-radius:3px;
	overflow:hidden;
}
.box_item3 .text{
	width: 269px;
    height: 160px;
    margin: 13px 9px 0;
    overflow: hidden;
	color:#000;
	background: #FFC;
    font-size: 1.4em;
	line-height: 1.1em;
	padding: 0px 6px;
}
.book_button{
	width:100px;
	height:30px;
	background:#F00;
	color:#FFF;
	line-height: 1.0em;
	font-weight:bold;
	text-align:center;
	border-radius: 20px;	
	margin:10px 0 5px 0;
}
.book_button2{
	width:80px;
	height:26px;
	background:#F00;
	color:#FFF;
	text-align:center;
	line-height: 0.9em;
	font-weight:bold;
	border-radius: 20px;	
	margin:-12px 5px -52px 0px;
}
.book_button2:hover{
	background:#FF0;
	color:#F00;	
}
.news_item{
	/*float:left;*/
	display:block;
	width:308px;
	height:250px;
	overflow:hidden;
	text-align:center;
	margin:0 auto;
	border:0px solid #00F;
}
.news_item_img{
	float:left;
	display:block;
	width:100%;
	height:200px;
	text-align:center;
	padding: 6px 5px 0px;
	overflow:hidden;
}
.news_item_img img{
	width:auto;
	height:200px;
}
.news_item_text{
	float: left;
    position: absolute;
    display: block;
    width: 100%;
    height: auto;
    margin-top:252px;
    line-height: 1.0em;
	color:#FFF;
    background: ##070764;
	padding: 3px 3px 0;
}
.news_item_text a{
	
}
.news_item_text:hover{
	color:#FF0000;	
}

.news_mobile_img{
	float:left;
	display:block;
	width:306px;
	height:208px;
	background:url(../img/news-img-mobile-bg.png) no-repeat;
	padding: 4px 4px 0px;
}
.news_mobile_img img{
	overflow:hidden;
	width:298px;
	height:194px;
}

.taxi_text{
	float: left;
    position: absolute;
    display: block;
    width: 100%;
    height: auto;
    margin-top:190px;
    line-height: 1.1em;
	color:#FFF;
    background: ##070764;
	padding: 3px 3px 0;
	text-align:center;
}

.rate1{
	float:left;
	width:30%;
	height:auto;
	margin: 15px 20px 15px 20px;
	color:#000;
	size:1.4em;	
}
.rate2{
	float:left;
	width:45%;
	height:auto;
	margin: 15px 8px 15px 8px;
	color:#000;
	size:1.4em;	
}
.tb_rate1{
	width:100%;	
}
.tb_rate1 th{
	background:#070764;
	color:#FFF;
	padding:5px 5px 5px 5px;	
}
.tb_rate1 tr{
	background:#FFFFFF;
	color:#000;
	line-height: 1.6em;
	border-bottom:1px #00F dashed;
}
.tb_rate1 a{
	color:blue;
}
.tb_rate1 a:hover{
	color:red;
}

.title_rate{
	width:100%;
	height:auto;
	font-size: 1.2em;
	color:#000;
    text-align: center;
    margin-bottom: 15px;	
}

.breed_item{
	float:left;
	display:block;
	width:241px;
	height:350px;
	overflow:hidden;
	margin: 0px 4px 0 4px;
	border:0px solid #00F;
	box-shadow: 2px 2px 5px 2px rgba(50,50,50,.4);
}
.breed_item_img{
	float:left;
	display:block;
	width:100%;
	height:200px;
	text-align:center;
	overflow:hidden;
}
.breed_item_img img{
	width:auto;
	height:200px;
}
.breed_item_text{
	float: left;
    display: block;
    width: 100%;
    height: auto;
    color: #271e1e;
    font-size: 1em;
    background: #d1d1d1;
	padding: 4px 7px 0;
}


.small_item{
	float:left;
	display:block;
	width:100px;
	height:150px;
	position:relative;
	overflow:hidden;
	margin: 0px 3px 4px 4px;
	border: 3px solid #CCC;
}
.small_item .img{
	float:left;
	display:block;
	width:100%;
	height:100px;
	text-align:center;
	overflow:hidden;
}
.small_item_text{
	float: left;
    display: block;
    width: 96px;
    height: auto;
    margin-top:0px;
    color: #271e1e;
    font-size: 0.8em;
	line-height: 1.4em;
    background: #d1d1d1;
	border-top: 4px solid red;
}
.small_item:hover{
	opacity:0.7;
}

.list_breeding{
	float: left;
    display: block;
    width: 100%;
    height: auto;
    background: url(../img/icon/li_list_direction.png) no-repeat left center;	
}
.list_breeding_text{
	float: right;
    display: block;
    width: 100%;
    height: auto;
    padding-left: 25px;
    overflow: hidden;
    border-bottom: 1px dashed #f0dea3;	
}


.vacci_block{
	float: left;
	display:block;
	width: 50%;
	height: 275px;
	text-align:center;
	margin:10px 0px 0px;
	border:0px solid #999;
}
.vacci_text{
	float:right;
	display:block;
	width:225px;
	height:147px;
	font-size:14px;
	margin-top: 10px;
	overflow:hidden;
}

#webboard_list{
	float: left;
	display:block;
	width: 98.7%;
	height: auto;
	margin-left:5px;
}
.comment_web_bg{
	float:left;
	display:block;
	width:100%;
	height:auto;
	background: #c5ddf3;
	border-radius: 5px;
	padding:5px 2px 7px 2px;
}
.show_web{
	width:100%;
	margin: 0 auto;
	background:#a8b1b7;
	border:solid #FFFFFF 3px;
}
.show_comment{
	width:100%;
	margin: 0 auto;
	background:#a8b1b7;
	border:solid #FFFFFF 3px;
}
#formID2 input[type=text], #formID2 textarea{
	width: 90%;
	border:1px solid #c5ddf3;
	padding-top: 0px;
	padding-bottom: 3px;
}

#view_all a{
	float:right;
	display:block;
	clear:both;
	font-size:0.8em;
	text-decoration:underline;
}

#pagination{
	float:right;
	display:block;
	width:100%;
	height:20px;
	border:0px solid #F00;
	margin-top:20px;
	margin-bottom:20px;
	clear:both;
}
#curent{
	float:left;
	display:block;
	width: 27px;
    height: 27px;
    padding-top: 0px;
	text-align:center;
	background:#959595;
	color:#ffffff;
	font-size:22px;
	border:0px solid #cee1bc;
	border-radius:3px;
	margin: 0 3px 0;
}
.prev_link{
	float:left;
	width:30px;
	height:30px;
	background:url(../img/icon/all-icon1.png);	
	background-position:-81px -79px;
    background-size: 190px;
	opacity:0.7;
}
.prev_link:hover{
	opacity:1;
}
.next_link{
	float:left;
	width:30px;
	height:30px;
	background:url(../img/icon/all-icon1.png);	
	background-position:-42px -79px;
    background-size: 190px;
	opacity:0.7;
}
.next_link:hover{
	opacity:1;
}
.next{
	float:left;
	width: 27px;
    height: 27px;
    padding-top: 0px;
	text-align:center;
	background:#d7d7d7;
	font-size:22px;
	color:#ffffff;
	border:0px solid #cee1bc;
	border-radius:3px;
	margin: 0 3px 0;
}
.next:hover{
	background:#959595;
}
/*.next a{
	color:#000000;
}
.next a:hover{
	color:#ffffff;
}*/
.arrow{
	float:left;
	display:block;
	width: 55px;
    height: 27px;
    padding-top: 0px;
	text-align:center;
	background:#d7d7d7;
	font-size:22px;
	border:0px solid #FFFFFF;
	border-radius:3px;
	margin: 0 3px 0;
}
.arrow:hover{
	background:#959595;
}
/*.arrow a:hover{
	color:#ffffff;
}*/
.active{
	background:#959595;	
}

.vacci_icon{
	float:left;
	width:30px;
	height:30px;
	background:url(../img/icon/all-icon1.png);	
	background-position:0px -60px;
    background-size: 150px;
}

.breed_active{
	float:left;
	width:30px;
	height:30px;
	background:url(../img/icon/all-icon3.png) no-repeat;	
	background-position:-31px -61px;
    background-size: 150px;
}
.breed_none{
	float:left;
	width:30px;
	height:30px;
	background:url(../img/icon/all-icon3.png) no-repeat;	
	background-position:-63px -61px;
    background-size: 150px;
}

.gallery_box{
	float:left;
	display:block;
	width:250px;
	height:285px;	
}

.species_box1{
	float:left;
	display:block;
	width:25%;
	height:1500px;
	padding-top:695px;
	border:0px solid #00F;	
}
.species_box2{
	float:left;
	display:block;
	width:25%;
	height:1500px;
	padding-top:330px;
	border:0px solid #00F;	
}
.species_box3{
	float:left;
	display:block;
	width:25%;
	height:1500px;
	padding-top:143px;
	border:0px solid #00F;	
}
.species_box4{
	float:left;
	display:block;
	width:25%;
	height:1500px;
	padding-top:57px;
	border:0px solid #00F;	
}

.main_activity{
	float: left;
	display:block;
	width: 100%;
	height: 265px;
	background:url(../img/main_activity_bg.png) no-repeat;
	margin-bottom:20px;
	padding: 70px 5px 0px 18px;
}
.acyivity_img{
	float:left;
	display:block;
	width:214px;
	height:147px;
	background:url(../img/main_activity_img_bg.png) no-repeat;
	padding: 7px;
	margin-bottom:10px;
	overflow:hidden;
}
.acyivity_img a:hover{
	color:#F00;
}
.acyivity_img img{
	height:133px;
}

.species_title{
	width:80%;
	text-align:center;
	clear:both;
}
.activity_text{
	float:right;
	display:block;
	width:410px;
	height:147px;
	font-size:14px;
	margin-bottom:10px;
	overflow:hidden;
}
.activity_text .title{
	font-size:14px;
	color:#e55f0d;
}
.activity_text .readmore{
	float:right;
	font-size:12px;
	color:#e55f0d;
}

.inbreed_item{
	float:left;
	display:block;
	width:110px;
	height:110px;
	margin: 20px 5px 20px 5px;
	border:0px solid #00F;	
}
.inbreed_img{
	float: left;
	display: block;
	width: 110px;
	height: 75px;
	padding: 5px;
	margin-bottom: 10px;	
}

.back_link img{
	opacity:0.7;	
}
.back_link img:hover{
	opacity:1;	
}
.back_link a{
	font-size:0.9em;
	color:#666;
}
.back_link a:hover{
	color:#000;
}


.img_twin{
	width:60%;	
	margin-top:-80px;
}

#set_price input[type=text],#set_price input[type=number],#set_price select{
	border:1px solid #c5ddf3;
	border-radius:5px;
}
#set_price input[type=submit]{
	border:1px solid #c5ddf3;
	border-radius:5px;
	cursor:pointer;
}
#set_price input[type=submit]:hover{
	background:#0F0;
}

@media (max-width: 444px) {
  .recaptchatable #recaptcha_image {
    margin: 0 !important;
    width: 225px !important;
  }
  .recaptcha_r2_c2,
  .recaptcha_r2_c1 {
    display: none !important;
  }
  #recaptcha_widget_div {
    width: 225px !important;
  }
  .recaptchatable .recaptcha_r1_c1,
  .recaptchatable .recaptcha_r3_c1,
  .recaptchatable .recaptcha_r3_c2,
  .recaptchatable .recaptcha_r7_c1,
  .recaptchatable .recaptcha_r8_c1,
  .recaptchatable .recaptcha_r3_c3,
  .recaptchatable .recaptcha_r2_c1,
  .recaptchatable .recaptcha_r4_c1,
  .recaptchatable .recaptcha_r4_c2,
  .recaptchatable .recaptcha_r4_c4,
  .recaptchatable .recaptcha_image_cell {
    background: none !important;
  }
  #recaptcha_whatsthis_btn,
  #recaptcha_switch_audio,
  #recaptcha_reload_btn {
    display: none !important;
  }
  #recaptcha_reload_btn {
    margin-top: 20px;
  }
  
  .left_content {
	width:100%;  
  }
  .main_content {
	width:100%;	  
  }
  .main_logo_xs img {
	  max-width: 50px;
	}

	.member_menu{
		width: 50%;
		height:auto;
		margin:0 auto;	
	}
	
	.img_twin{
		width:100%;	
	}
	
	#set_price input[type=text],#set_price input[type=number],#set_price select{
		width: 59px;
		border:1px solid #c5ddf3;
		border-radius:5px;
	}
	.box_slide{
		width:100%;
		height:180px;
		overflow:hidden;	
	}
	
	.course_bg{
		height:auto;
	}
	.menu_bg{
		height:auto;
		background:url(../assets/img/food-menu-mobile-bg.png);
		text-align:center;
	}
	.box_item{
		/*width:100%;*/
		margin: 20px auto;	
	}
	.activity_bg{
		height:auto;
		background:url(../assets/img/activity-mobile-bg.png);
	}
	.box_item3{
		float:none;
		/*width:360px;*/
		margin: 20px auto;
		/*padding: 17px 0px 0px 11px;*/
	}
	.box_item3 .img{
		height: 171px;
	}
	.box_item3 .text{
		/*width: 310px;*/
	}
	.button1{
		background-size:293px;	
	}
	
	.rate1{
		width:90%;	
	}
	.rate2{
		width:90%;	
	}
	.content_warpper {
	  margin-top:10px;
	}
	.rate1{
		width:100%;
		margin: 20px auto;	
	}
	.rate2{
		width:100%;
		margin: 20px auto;	
	}
}

@media screen and (min-width: 445px) and (max-width: 599px) {
  .left_content {
	width:40%;  
  }
  .main_content {
	width:100%;	  
  }
  .main_logo_xs img {
	  max-width: 50px;
	}
	.img_twin{
		width:80%;	
	}
	.box_slide{
		width:100%;
		height:220px;
		overflow:hidden;	
	}
	.box_item{
		margin: 20px auto;	
	}
	.box_item3{
		float:none;
		/*width:360px;*/
		margin: 0 auto;
		padding: 17px 0px 0px 11px;
	}
	.content_warpper {
	  margin-top:45px;
	}
	.rate1{
		width:100%;
		margin: 20px auto;	
	}
	.rate2{
		width:100%;
		margin: 20px auto;	
	}
}

@media screen and (min-width: 600px) and (max-width: 767px) {
	.left_content {
	width:30%;  
  }
  .main_content {
	width:100%;	  
  }
  .main_logo_xs img {
	  max-width: 50px;
	}
}

@media screen and (min-width: 768px) and (max-width: 1025px) {

}

@media (min-width:1025px) and (max-width:1600px){

}

@media (min-width:1600px) and (max-width:2500px){

	
}

/* To fill the container and nothing else */
.fb_iframe_widget,
.fb_iframe_widget span,
.fb_iframe_widget span iframe[style] {
  width: 100% !important;
  margin-bottom: 25px;
}
