/*

*	Jayson CSS

*/



/* Notification inactive state */

.noti_btn_inactive {

	background-color: #eeeeee;

	background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fbfbfb), color-stop(100%, #e1e1e1));

	background: -webkit-linear-gradient(top, #fbfbfb, #e1e1e1);

	background: -moz-linear-gradient(top, #fbfbfb, #e1e1e1);

	background: -o-linear-gradient(top, #fbfbfb, #e1e1e1);

	background: linear-gradient(top, #fbfbfb, #e1e1e1);

	display: -moz-inline-stack;

	display: inline-block;

	vertical-align: middle;

	zoom: 1;

	border: 1px solid #d4d4d4;

	height: 32px;

	line-height: 32px;

	padding: 0px 25.6px;

	font-weight: 300;

	font-size: 14px;

	font-family: "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;

	color: #666666;

	margin: 0;

	text-decoration: none;

	text-align: center;

}



/* Notification active state */

.noti_btn_active:hover {



	background: #FCC;



}



.noti_btn_active {



	background-color: #EEE;

	display: -moz-inline-stack;

	display: inline-block;

	vertical-align: middle;

	zoom: 1;

	border: 1px solid #d4d4d4;

	height: 32px;

	line-height: 32px;

	padding: 0px 25.6px;

	font-weight: 300;

	font-size: 8px;

	font-family: "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;

	color: #900;

	margin: 0;

	text-decoration: none;

	text-align: center;

}



/* Circle style for notification */

.btn_noti_circle {

	-webkit-border-radius: 240px;

	-moz-border-radius: 240px;

	-ms-border-radius: 240px;

	-o-border-radius: 240px;

	border-radius: 240px;

	-webkit-box-shadow: inset 0px 1px 1px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.2);

	-moz-box-shadow: inset 0px 1px 1px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.2);

	box-shadow: inset 0px 1px 1px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.2);

	width: 20px;

	line-height: 21px;

	height: 20px;

	padding: 0px;

	border-width: 4px;

	font-size: 19px;

}



/* The notification list */

.noti_list {

	position: absolute; z-index: 1; border: 1px solid #999; padding: 5px; background-color: #CCC; border-radius: 5px; width: 280px; max-height: 300px; overflow-x: hidden; overflow-y: auto; margin-left: -300px; margin-top: -33px;


}

.noti_list li {

	padding: 5px;

	background-color: #FFF;

	border: 1px solid #CCC;

	height: 60px;

}

.noti_list li a {

	color: #000;

	font-weight: normal;

	font-family: sans-serif;

}



.noti_list-faq {

	position: absolute; z-index: 1; border: 1px solid #999; padding: 5px; background-color: #CCC; border-radius: 5px; width: 280px; max-height: 300px; overflow-x: hidden; overflow-y: auto; margin-left: -300px; margin-top: -33px;


}


.noti_list-set {

  position: absolute;

  z-index: 1;

  border: 1px solid #999;

  padding: 5px;

  background-color: #CCC;

  border-radius: 5px;

  width: 280px;

  max-height: 300px;

  overflow-x: hidden;

  overflow-y: auto;

  margin-left:-300px;

  margin-top: -33px;

}



/* Arrow point to top for the notification*/

.arrow {

	width: 0;

	height: 0;

	border-color: transparent transparent #CCC transparent;

	border-style: solid;

	border-width: 9px;



	-ms-transform: rotate(90deg);

	-webkit-transform: rotate(90deg);

	transform: rotate(90deg);

	margin-top: -25px;

	padding-bottom: 7px;

	margin-left: -5px;



}



.arrow-v2 {

	width: 0;

	height: 0;

	border-color: transparent transparent #CCC transparent;

	border-style: solid;

	border-width: 9px;

	-ms-transform: rotate(90deg);

	-webkit-transform: rotate(90deg);

	transform: rotate(90deg);

	margin-top: 0px;

	padding-bottom: 13px;

	margin-left: -2px;

}