.pn-bell {
	width:32px;
	height:32px;
	overflow:hidden;
	/*border:1px solid Gray;*/
	margin:0;
	padding:0;
	list-style:none;
	border-radius:5px;
	position:absolute;
	top:55px;
	right:1%;
	z-index:1001;
/*10000*/
}

#pnsettings{
	width:500px;
	height:400px;
	overflow:scroll;
	border:1px solid Gray;
	background:white;
	margin:0;
	padding:0;
	list-style:none;
	border-radius:5px;
	position:absolute;
	top:80px;
	left:35%;
	z-index:1001;
}

#pnsettings-title{
	width:100%;
	height:32px;
	overflow:hidden;
	border:1px solid Gray;
	background:Gray;
	margin:0;
	padding:0;
	list-style:none;
	position:absolute;
	top:0px;
	left:0px;
	z-index:1001;
}

#pnsettings-title-text{
	color:white;
	font-size:12pt;
	padding:4px 10px;
}

#pnsettings-form{
	position:absolute;
	top:33px;
	overflow:auto;
	height:350px;
}





@import url(https://fonts.googleapis.com/css?family=Ubuntu);
#pnsettings-title > h1 {
	 font-family: 'Ubuntu', sans-serif;
	 color: #fff;
	 font-size: 14px;
	 font-weight: normal;
	 margin-bottom: 50px;
}
 .toggle-btn {
	 width: 60px;
	 height: 30px;
	 margin: 7.5px;
	 border-radius: 50px;
	 display: inline-block;
	 position: relative;
	 background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAyklEQVQ4T42TaxHCQAyENw5wAhLACVUAUkABOCkSwEkdhNmbpHNckzv689L98toIAKjqGcAFwElEFr5ln6ruAMwA7iLyFBM/TPDuQSrxwf6fCKBoX2UMIYGYkg8BLOnVg2RiAEexGaQQq4w9e9klcxGLLAUwgDAcihlYAR1IvZA1sz/+AAaQjXhTQQVoe2Yo3E7UQiT2ijeQdojRtClOfVKvMVyVpU594kZK9zzySWTlcNqZY9tjCsUds00+A57z1e35xzlzJjee8xf0HYp+cOZQUQAAAABJRU5ErkJggg==') no-repeat 35px center #a9a9a9;
	 cursor: pointer;
	 -webkit-transition: background-color 0.4s ease-in-out;
	 -moz-transition: background-color 0.4s ease-in-out;
	 -o-transition: background-color 0.4s ease-in-out;
	 transition: background-color 0.4s ease-in-out;
	 cursor: pointer;
}
 .toggle-btn.active {
	 background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAmUlEQVQ4T6WT0RWDMAhFeZs4ipu0mawZpaO4yevBc6hUIWLNd+4NeQDk5sE/PMkZwFvZywKSTxF5iUgH0C4JHGyF97IggFVSqyCFga0CvQSg70Mdwd8QSSr4sGBMcgavAgdvwQCtApvA2uKr1x7Pu++06ItrF5LXPB/CP4M0kKTwYRIDyRAOR9lJTuF0F0hOAJbKopVHOZN9ACS0UgowIx8ZAAAAAElFTkSuQmCC') no-repeat 10px center #008080;
}
 .toggle-btn.active .round-btn {
	 left: 32.5px;
}
 .toggle-btn .round-btn {
	 width: 22.5px;
	 height: 22.5px;
	 background-color: #fff;
	 border-radius: 50%;
	 display: inline-block;
	 position: absolute;
	 left: 5px;
	 top: 50%;
	 margin-top: -11.75px;
	 -webkit-transition: all 0.3s ease-in-out;
	 -moz-transition: all 0.3s ease-in-out;
	 -o-transition: all 0.3s ease-in-out;
	 transition: all 0.3s ease-in-out;
}
 .toggle-btn .cb-value {
	 position: absolute;
	 left: 0;
	 right: 0;
	 width: 100%;
	 height: 100%;
	 opacity: 0;
	 z-index: 9;
	 cursor: pointer;
	 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

#pnsettings.table, #pnsettings.td, #pnsettings.th {  
  border: 1px solid #ddd;
  text-align: left;
  font-family: 'Ubuntu', sans-serif;
}

#pnsettings.table {
  border-collapse: collapse;
  width: 100%;
}

#pnsettings.th, #pnsettings.td {
  padding: 10px;
}

#pnsettings.td.toggle{
width:80px;
}

.box {
  width: 300px;
  margin: 50px auto;
  background: #1D8198;
  padding: 20px;
  text-align: center;
  font-weight: 900;
  color: #fff;
  font-family: arial;
  position:absolute;
  right:4%;
  z-index:1001;
}

.sb1:before {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  border-left: 10px solid #1D8198;
  border-right: 10px solid transparent;
  border-top: 10px solid #1D8198;
  border-bottom: 10px solid transparent;
  right: -20px;
  top: 6px;
}