.test {
	border: 1px solid #FF0004;
}
.parallax {
	background-attachment: fixed !important;
}
/*scroll*/
.scroll {
    margin-left: -85px;
    font-weight: bold !important;
    text-shadow: 0 1px 1px rgba(0,0,0,.2);
    font-size: 14px;
}
@-webkit-keyframes ani-mouse {
	0% {
	opacity: 1;
	top: 29%;
	}
	15% {
	opacity: 1;
	top: 50%;
	}
	50% {
	opacity: 0;
	top: 50%;
	}
	100% {
	opacity: 0;
	top: 29%;
	}
}
@-moz-keyframes ani-mouse {
	0% {
	opacity: 1;
	top: 29%;
	}
	15% {
	opacity: 1;
	top: 50%;
	}
	50% {
	opacity: 0;
	top: 50%;
	}
	100% {
	opacity: 0;
	top: 29%;
	}
}
@keyframes ani-mouse {
	0% {
	opacity: 1;
	top: 29%;
	}
	15% {
	opacity: 1;
	top: 50%;
	}
	50% {
	opacity: 0;
	top: 50%;
	}
	100% {
	opacity: 0;
	top: 29%;
	}
}
 .scroll-btn {
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	text-align: center;
}
.scroll-btn > * {
	display: inline-block;
	line-height: 18px;
	color: #7f8c8d;
	color: #1e67a5;
	font-family: "proxima-nova", "Helvetica Neue", Helvetica, Arial, sans-serif;
	letter-spacing: 2px;
}
.scroll-btn > *:hover,
.scroll-btn > *:focus,
.scroll-btn > *.active {
	color: #1e67a5;
}
.scroll-btn > *:hover,
.scroll-btn > *:focus,
.scroll-btn > *:active,
.scroll-btn > *.active {
	opacity: 0.8;
	filter: alpha(opacity=80);
}
.scroll-btn .mouse {
    position: relative;
    display: block;
    width: 35px;
    height: 55px;
    margin: 0px auto 20px 56px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 3px solid #1e67a5;
    border-radius: 23px;
}
.scroll-btn .mouse > * {
	position: absolute;
	display: block;
	top: 29%;
	left: 50%;
	width: 8px;
	height: 8px;
	margin: -4px 0 0 -4px;
	background: #1e67a5;
	border-radius: 50%;
	-webkit-animation: ani-mouse 2.5s linear infinite;
	-moz-animation: ani-mouse 2.5s linear infinite;
	animation: ani-mouse 2.5s linear infinite;}
/*end scroll*/
.line-cave{background-image: url(../../img/line-cave.png); background-repeat: repeat-x; height: 45px;}
.line-cave-up{background-image: url(../../img/line-cave-up.png); background-repeat: repeat-x; height: 39px;}
.rope-brown{height:10px; background-image: url(../../img/rope.png); background-repeat: repeat-x;}
.rope-brown1{height:10px; background-image: url(../../img/rope.png); background-repeat: repeat-x;background-color: #1e68a5;}
.bg-character{padding: 0 0 0 0;
	width: 100%;
	background-image: url(../../img/character.png);
	background-repeat: no-repeat;
	background-position: top center;position: 
	relative;}
.bg-pattern{padding: 0 0 0 0;
	width: 100%;
	background-image: url(../../img/pattren1.png);
	background-repeat: no-repeat;
	background-position: top center;position: 
	relative;}
/*css order*/
ol {
	list-style: none;
	counter-reset: mycounter;
	padding: 0;
}
ol li {
	position: relative;
	margin-left: 30px;
	padding: 0px 7px;
	margin-bottom: 8px;
}
ol li:before {
	content: counter(mycounter);
	counter-increment: mycounter;
	position: absolute;
	top: 0;
	left: -30px;
	width: 25px;
	height: 25px;
	line-height: 25px;
	border-radius: 50%;
	color: #e6a951;
	background: #673b10;
	text-align: center;
}

/*end css order*/
/*btn-brown*/
.push_button_brown {
	position: relative;
	width: 300px;
	color: #ffffff !important;
	display: block;
	text-decoration: none;
	margin: 0 auto;
	border-radius: 150px;
	background: #e6a951;
	text-align: center;
	padding: 15px 20px;
	-webkit-transition: all 0.1s;
	-moz-transition: all 0.1s;
	transition: all 0.1s;
	-webkit-box-shadow: 0px 9px 0px #ffa4b9;
	-moz-box-shadow: 0px 9px 0px #84261a;
	box-shadow: 0px 9px 0px #512900;
	font-size: 24px;
	text-shadow: 0 -1px 1px rgb(215, 155, 70);
	background-image: linear-gradient(#e6aa51, #7f4c00);
	border: solid 1px #c18836;
	margin-bottom: 25px;
}
.push_button_brown:hover {
	color: #ffffff;
	text-decoration: none;
}
.push_button_brown:active {
	-webkit-box-shadow: 0px 2px 0px #512900;
	-moz-box-shadow: 0px 2px 0px #512900;
	box-shadow: 0px 2px 0px #512900;
	position: relative;
	top: 7px;
}
/*head*/
.bg-head {
	padding: 0 0 0 0;
	width: 100%;
	background-image: url(../../img/layer-back.jpg);
	background-repeat: no-repeat;
	background-position: top center;
}
.au-vdo-border {
    border: 10px solid #6ab8e6;
    border-radius: 20px;
    box-shadow: 0 0 0 5px #1e67a5, 0 0 0 9px #4291cf, 0 0px 7px 8px rgb(255, 255, 255);
    position: relative;
    z-index: 1;
}
/*event1*/
.text-tag{
	color: #9711ff;
    font-size: 25px;
    display: inline-block;
    border-bottom: solid 1px #9711ff;
    line-height: 25px;}
.text-tag2{color: #ff1111;
    font-size: 25px;
    display: inline-block;
    border-bottom: solid 1px #ff1111;
    line-height: 25px;}
.bg-event1 {
    padding: 15px 0 0 0;
    background-color: #84cbec;
    background-image: url(../../img/pattern.png);
}
.box-gift {
    border-radius: 15px;
    border: 9px solid #e6aa51;
	box-shadow: 2px 2px 3px rgba(0,0,0,0.28);
}
.text-mission {
    font-size: 24px;
    color: #673b10;
    font-weight: bold;
    /* text-shadow: 0.025em 0.025em 0.025em rgba(0, 0, 0, 0.8); */
    text-shadow: 2px 0 0 #e6ad4f, -2px 0 0 #e6ad4f, 0 2px 0 #dd9c35, 0 -2px 0 #e6ad4f, 1px 1px #e6ad4f, -1px -1px 0 #e6ad4f, 1px -1px 0 #e6ad4f, -1px 1px 0 #e6ad4f;
}
.h-t-title {
    color: #673b10;
    background-position: center top;
    font-weight: bold;
    font-size: 22px;
    /* background-image: linear-gradient(#673b10, #422400); */
    padding: 10px 0 10px 0;
    border-radius: 7px 7px 0 0;
    font-family: 'Kanit', sans-serif;
    text-shadow: 2px 0 0 #e6ad4f, -2px 0 0 #e6ad4f, 0 2px 0 #dd9c35, 0 -2px 0 #e6ad4f, 1px 1px #e6ad4f, -1px -1px 0 #e6ad4f, 1px -1px 0 #e6ad4f, -1px 1px 0 #e6ad4f;
    background-image: url(../../img/wood.png);
}
.box-002 {
    background-image: url(../../img/bg-frame.png);
    background-color: #fbc469;
    color: #563100!important;
    border-radius: 10px;
    border: 6px solid #e6ab51;
    margin-top: 0px;
    box-shadow: 0 0 0 4px #e6ac51, 0 0 0 8px #b07023, 0 2px 3px 3px rgb(176, 112, 35);
    /* box-shadow: 0 0 20px 0 rgb(255, 207, 0); */
}
/*event2*/
.bg-event2 {
    padding: 0 0 0 0;
    background-color:#84cbec;
    color: #cc7c7c;
    background-image: url(../../img/pattern.png);
}
.bg-event2-2{
	padding: 0 0 0 0;
	width: 100%;
	/*background-image: url(../../img/bg-event2.png);*/
	background-repeat: no-repeat;
	background-position: top center;}
.text-mission2 {
    font-size: 18px;
    color: #673b10;
    font-weight: bold;
    /* text-shadow: 0.025em 0.025em 0.025em rgba(0, 0, 0, 0.8); */
    text-shadow: 2px 0 0 #e6ad4f, -2px 0 0 #e6ad4f, 0 2px 0 #dd9c35, 0 -2px 0 #e6ad4f, 1px 1px #e6ad4f, -1px -1px 0 #e6ad4f, 1px -1px 0 #e6ad4f, -1px 1px 0 #e6ad4f;
}
.bg-coconut{
    padding: 0 0 0 0;
    width: 100%;
    background-image: url(../../img/bg-event2-2.png);
    background-repeat: no-repeat;
    background-position: bottom center; 
    z-index: 0;
    position: relative;}
/*event3*/
.bg-event3 {
    padding: 40px 0 40px 0;
    background-color:#02abca;
    color: #ffffff;
	background-image: url(../../img/pattern.png);
	
}
.bg-event3-2{
	padding: 0 0 0 0;
	width: 100%;
	/*background-image: url(../../img/bg-event3.png);*/
	background-repeat: no-repeat;
	background-position: top center;}



/* lg */ 
@media (min-width: 1200px) {

}

/* md */
@media (min-width: 992px) and (max-width: 1199px) {
.line-sky {
    margin-top: 70px;
    z-index: 0;
    position: relative;
}
}

/* sm */
@media (min-width: 768px) and (max-width: 991px) {
 	
}

/* xs */
@media (max-width: 767px) {
	
}

/* XS Portrait */
@media (max-width: 479px) {
 
}