/*!********************************************************************
***************************Copyright (c) 2016 by yuchen.****************
*************************************************************************/


/*************************
*******main.css******
**************************/

body {
	font-family: 'Verdana', Helvetica, "Microsoft YaHei", "微軟雅黑體 ", "微軟正黑體", "Microsoft JhengHei", sans-serif;
	color: #161616;
	line-height: 30px;
	background:#ECE9E6;
	background-image: -webkit-linear-gradient(left,#ECE9E6, #fff);
	background-image: -moz-linear-gradient(left,#ECE9E6, #fff);
	background-image: -o-linear-gradient(left,#ECE9E6, #fff);
	background-image: linear-gradient(left,#ECE9E6, #fff);
	position:relative;
}

p {
	font-size: 14px;
	letter-spacing: 2px;
}
a {
	color: #14aebc;
	-webkit-transition: color 300ms, background-color 300ms;
	-moz-transition: color 300ms, background-color 300ms;
	-o-transition: color 300ms, background-color 300ms;
	transition: color 300ms, background-color 300ms;
}
a:hover,
a:focus {
	color: #00d5e8;
	text-decoration: none;
	outline: none;
}
/********************************************************************
***********************************login*****************************
********************************************************************/


/****source:http://bootsnipp.com/snippets/d39ve    *****/

.panel {
	margin-top: 120px;
	background-color: transparent;
}
.panel-body {
    padding: 15px;
    background: rgba(255, 255, 255, 0.7);
}

@media screen and (max-width:768px) {
	.loginbtn input {
		margin-top: 10px;
	}
}

.panel-info {
	border-color: #5cb85c;
}

.panel-info>.panel-heading {
	color: #ffffff;
	background-color: #5cb85c;
	border-color: #bce8f1;
}

.panel-info .ripple input[type="submit"] {
	position: relative;
	border: none;
	outline: none;
	cursor: pointer;
	background: #5cb85c;
	color: #ffffff;
	padding: 8px 20px;
	border-radius: 50px;
	font-size: 14px;
	border: 1px #5cb85c solid;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}

.panel-info .ripple input[type="submit"]:hover {
	background: #3d8b3d;
	border: 1px #3d8b3d solid;
}

.panel-info .ripple input[type="reset"] {
	position: relative;
	border: none;
	outline: none;
	cursor: pointer;
	background: #ffffff;
	color: #5cb85c;
	padding: 8px 20px;
	border-radius: 50px;
	font-size: 14px;
	border: 1px #5cb85c solid;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}

.panel-info .ripple input[type="reset"]:hover {
	color: #3d8b3d;
	border: 1px #3d8b3d solid;
}

.panel-default {
	border-color: #5fb0e4;
}

.panel-default>.panel-heading {
	color: #ffffff;
	background-color: #5fb0e4;
	border-color: #bce8f1;
}

.panel-default .ripple input[type="button"] {
	position: relative;
	border: none;
	outline: none;
	cursor: pointer;
	background: #ffffff;
	color: #5fb0e4;
	padding: 8px 20px;
	border-radius: 50px;
	font-size: 14px;
	border: 1px #5fb0e4 solid;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}

.panel-default .ripple input[type="button"]:hover {
	background: #248ed3;
	border: 1px #248ed3 solid;
	color: #ffffff;
}

#services_login a {
	color: #000000;
}

#services_login a:visited {
	color: #000000;
}

#services_login a:hover,
#services_login a:focus {
	color: #5fb0e4;
}

.panel-success {
	border-color: #748bce;
}

.panel-success>.panel-heading {
	color: #ffffff;
	background-color: #748bce;
	border-color: #748bce;
}

.panel-success .ripple input[type="button"] {
	position: relative;
	border: none;
	outline: none;
	cursor: pointer;
	background: #748bce;
	color: #ffffff;
	padding: 8px 20px;
	border-radius: 50px;
	font-size: 14px;
	border: 1px #748bce solid;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}

.panel-success .ripple input[type="button"]:hover {
	background: #7475ce;
	border: 1px #7475ce solid;
	color: #ffffff;
}


/**svg背景**/

#particles-js{
  	width: 100%;
  	height: 100%;
  	background-size: cover;
  	background-position: 50% 50%;
  	position: fixed;
  	top: 0px;
  	z-index:-1;
}