/**
* Design By Eggda-Studio
**/
@import url("https://fonts.googleapis.com/css?family=Kanit:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&subset=thai");
@import url("https://fonts.googleapis.com/css?family=Mitr:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&subset=thai");
@import url("https://fonts.googleapis.com/css?family=Asap:400,700|Roboto");

::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-track-piece{background-color:#fff;-webkit-border-radius:0px;}
::-webkit-scrollbar-thumb:horizontal,::-webkit-scrollbar-thumb:vertical{width:0px;background-color:#6edfff;-webkit-border-radius:0px;}
::-webkit-scrollbar-thumb:horizontal:hover,::-webkit-scrollbar-thumb:vertical:hover{background-color:#d8d6d5;}

body {
	font-family: "Kanit",sans-serif;
	margin:0 !important;
	padding:0 !important;
	color:#6f5c5c;
}
ul{
	list-style-type:none;
}
a:link{
	text-decoration:none;
}
a:visited{
	text-decoration:none;
}
a:hover{
	text-decoration:none;
}
a:active{
	text-decoration:none;
}
/**
*  Particles JS
**/
#particles-js {
	position: absolute;
	width: 100%;
	height: 600px;
	top: 35px;
	background-image: url('');
	background-repeat: repeat;
	background-size: cover;
	background-position: 50% 50%;
	z-index: 1;
	pointer-events: none;
}
/**
* Main wrapper
**/
.header_content {
    min-height: 650px;
    background-image: url(../../images/page/bg_mid1.jpg);
		background-repeat: no-repeat;
		background-position: center top;
    position: relative;
}
.page_change {
    width: 100%;
  	min-height: 650px;
    background-image: url(../../images/page/bg_mid2.jpg);
		background-repeat: no-repeat;
		background-position: center top;
    position: absolute;
		-webkit-animation: 3s change infinite linear;
		-moz-animation:  3s change infinite linear;
	  -o-animation:  3s change infinite linear;
	  -ms-animation: 3s change infinite linear;
		animation: 3s change infinite linear;
	}
@-webkit-keyframes change {
		0% {opacity: 1;}
		25% {opacity: 0;}
		50% {opacity: 1;}
		75% {opacity: 0;}
		100% {opacity: 1;}
}
@keyframes change {
		0% {opacity: 1;}
		25% {opacity: 0;}
		50% {opacity: 1;}
		75% {opacity: 0;}
		100% {opacity: 1;}
}
.header {
    margin: 0 auto;
    height: 650px;
    width: 900px;
    position: relative;
}
.header_logo {
	background: url(../../images/logo_sv.png);
	width:421px;
	height:179px;
	position: absolute;
	z-index: 1;
	top: 6.2em;
  left: 15em;
	-webkit-animation: 3s logo_doil infinite linear;
	-moz-animation: 3s logo_doil infinite linear;
	-o-animation: 3s logo_doil infinite linear;
	-ms-animation: 3s logo_doil infinite linear;
	animation: 3s logo_doil infinite linear;
}
@-webkit-keyframes logo_doil {
	0% { transform-origin:bottom; transform:rotate(-5deg);}
	50% { transform-origin:bottom; transform:rotate(5deg);}
	100% { transform-origin:bottom; transform:rotate(-5deg);}
}
@keyframes logo_doil {
	0% { transform-origin:bottom; transform:rotate(-5deg);opacity:1;}
	50% { transform-origin:bottom; transform:rotate(5deg);opacity:.9;}
	100% { transform-origin:bottom; transform:rotate(-5deg);opacity:1;}
}
/**
* Main Box
**/
.container.box {
    min-height: 800px;
    padding: 30px;
    position: relative;
}
.row {
    margin-right: -10px;
    margin-left: -10px;
}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7,
.col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    padding-right: 10px;
    padding-left: 10px;
}
.well {
    min-height: 20px;
    padding: 15px;
    margin-bottom: 0px;
    background-color: #ffffff;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, .08);
    box-shadow: 0 1px 5px rgba(0, 0, 0, .08);
}
.guide-header {
	font-family: Kanit;
	font-size:16px;
	font-weight:300;
	color:#c5c5c5;
	border-bottom: 1px solid #eee;
	margin: -3px 0 2px;
	padding-bottom: 7px;
}
.main-header {
	font-family: Kanit;
	font-size:16px;
	font-weight:300;
	color:#c5c5c5;
	border-bottom: 1px solid #eee;
	margin: -3px 0 2px;
	padding-bottom: 7px;
}
small {
    font-size: 75%;
}
.img_header {
	margin-top: -8px;
}
/**
* Nav Menu Support
**/
.nav > li > a {
  position: relative;
  display: block;
  padding: 6px 5px;
}
.nav-pills > li > a {
  border-radius: 0px;
  color: #9c8282;
	font-weight: 300;
	letter-spacing: 0.5px;
  background-color: transparent;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}
.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
  color: #ff7b7b;
	font-weight: 400;
	padding-left: 5px;
  background-color: transparent;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}
.nav > li > a:hover, .nav > li > a:focus {
  text-decoration: none;
  background-color: transparent;
  letter-spacing: 1px;
  padding-left: 10px;
	outline: 0 !important;
}
/**
* Eddga Alert
**/
.eddga-alert {
	font-family: 'Kanit',sans-serif;
	font-size:14px;
	font-weight:300;
	margin-top: 10px;
	margin-bottom: 15px;
	padding: 10px 15px;
	background:#cce9f2;
	border: 1px solid #86cde3;
	color:#2584a0;
	border-radius: 4px;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.30);
	-webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1);
	-moz-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1);
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1);
}
.eddga-alert-success {
	background: #d8f1c6;
	border-color: #b3cda1;
	color: #749958;
}
.eddga-alert-danger {
	background: #f9d9d9;
	border-color: #e1a1a1;
	color: #b55454;
}
.eddga-alert-warning {
	background: #fbf4dd;
	border-color: #d1c9ae;
	color: #978c68;
}
.eddga-alert-plain {
	background: #f8f8f8;
	border-color: #d1d1d1;
	color: #8c8c8c;
}

/**
* IcheckBox
**/
.icheckbox_minimal,
.iradio_minimal {
  display: inline-block;
  vertical-align: middle;
  margin: 0;
  padding: 0;
  width: 18px;
  height: 18px;
  background: url(../../images/blue.png) no-repeat;
  border: none;
  cursor: pointer;
}
.icheckbox_minimal {
  background-position: 0 0;
}
.icheckbox_minimal.hover {
  background-position: -20px 0;
}
.icheckbox_minimal.checked {
  background-position: -40px 0;
}
.icheckbox_minimal.disabled {
  background-position: -60px 0;
  cursor: default;
}
.icheckbox_minimal.checked.disabled {
  background-position: -80px 0;
}
.iradio_minimal {
  background-position: -100px 0;
}
.iradio_minimal.hover {
  background-position: -120px 0;
}
.iradio_minimal.checked {
  background-position: -140px 0;
}
.iradio_minimal.disabled {
  background-position: -160px 0;
  cursor: default;
}
.iradio_minimal.checked.disabled {
  background-position: -180px 0;
}
.fade-scale {
  transform: scale(0.9);
  opacity: 0;
  -webkit-transition: all .3s linear;
  -o-transition: all .3s linear;
  transition: all .3s linear;
}
.fade-scale.in {
  opacity: 1;
  transform: scale(1);
}
/**
* Footer Page
**/
#pagetop {
	position: fixed;
}
.pagetop {
	bottom: 80px;
	right: 0;
	display: block;
	-webkit-animation: 1.5s gost_doil infinite linear;
	-moz-animation: 1.5s gost_doil infinite linear;
	-o-animation: 1.5s gost_doil infinite linear;
	-ms-animation: 1.5s gost_doil infinite linear;
	animation: 1.5s gost_doil infinite linear;
}
@-webkit-keyframes gost_doil {
	0% {
	bottom: 80px;}
	50% {
	bottom: 100px;}
	100% {
	bottom: 80px;}
}
@keyframes gost_doil {
	0% {
	bottom: 80px;}
	50% {
	bottom: 100px;}
	100% {
	bottom: 80px;}
}
.chara {
}
.footer {
  background-color: #442a2a;
  font-family: "Kanit", sans-serif;
  font-size: 14px;
  font-weight: 300;
  color: #fff;
  line-height: 20px;
  text-align: center;
  min-height: 90px;
  margin: 0 auto;
  padding-top: 2.8em;
  position: relative;
	-webkit-box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.40);
	box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.40);
}
@media(max-width:1170px){
	body,html{
		width:1200px;
		overflow-x:hidden;
		}
}