.pophelp-headerTitle {

    position: absolute;
    padding: 10px 0 0px 10px;
    color : #5893bf !important;
    font-family: Arial, Helvetica, Helvetica Neue, Verdana, sans-serif;
    font-size: 18px;
    text-rendering: optimizeLegibility;
    text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
}
/*  <!-- added by sadique shaikh 29-1-2019  --> */
.pophelp-headerTitle2 {

  position: relative;
  padding: 10px 0 0px 10px;
  color : #5893bf !important;
  font-family: Arial, Helvetica, Helvetica Neue, Verdana, sans-serif;
  font-size: 16px;
  text-rendering: optimizeLegibility;
  text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
}

.contentDiv
{
border-top: #6cf 2px solid;
background-color: #fff;
padding: 10px 5px;
border-left: 1px solid #E7E1E1;
border-right: 1px solid #E7E1E1;
border-bottom: 1px solid #E7E1E1;
height: 284px;
font-family: "MuseoLight-300", sans-serif  !important;
}

.tableClass{
  border-collapse: collapse !important;
  font-family: "MuseoLight-300", sans-serif  !important;
}

.detailtr {
  width: 25%;
  margin: 2;
  font-family: "FreeSans", "Nimbus Sans L";
  vertical-align: center;
  font-family: "MuseoLight-300", sans-serif  !important;
}
.button {
  border: 1px solid #E7E7E7;
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
  color: #333;
  height: 22px !important;
  font-family: "MuseoLight-300", sans-serif  !important;
  font-size: 12px !important;
  background-color: #e7e7e7;
  cursor: pointer;
  margin-left: 10px;
  padding: 5px 10px;
}
/* new for table-end */
body
{
	background: transparent;
	font-family: "FreeSans", "Nimbus Sans L";
}

table
{
	margin-left: auto;
	margin-right: auto;
}

.task-add-overlay
{
  margin-left: 10px;
  margin-right: 10px;
  background-color: white;
  margin-bottom: 10px;
  box-shadow: 0 0 10px #000000;
  width:100%;
  margin: 10px 8px 8px 15px;/* Jboss -sun */
}
select
{
	font-family: "FreeSans", "Nimbus Sans L";
}

a:link
{
	COLOR: black;
}

a:visited
{
	COLOR: black;
}

a:hover
{
	COLOR: gray;
}

a:active
{
	COLOR: gray;
}

/* Changed by Prasad on 12/04/16 [mapping of one excel column to multiple xml columns] START */
.header
{
	/* background-color:#c6c6c6 ; */
	padding: 1;
	width: 100%;
	/*border: 0; */
	font-size: 16px;
	font-weight: bold;
	font-family: "FreeSans", "Nimbus Sans L";
	border-collapse: collapse;
	color: #525252;
	background-color: #fff !important;
}

input
{
	font-family: "FreeSans", "Nimbus Sans L";
}

.image
{
	vertical-align: middle;
}

.grayColor
{
	color: #525252;
	font-size: 14px;
}

.button
{
	border: 1px solid #E7E7E7;
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
	color: #333;
	height: 22px !important;
	font-family: 'MuseoLight-300', sans-serif;
	font-size: 12px !important;
	background-color: #e7e7e7;
	cursor: pointer;
	margin-left: 10px;
  padding: 5px 10px;
}

/* Added by Sainath T on 19/09/18-Start */
.thClass
{
	font-weight: bold;
	font-size: 14px;
	color: #413839;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 5px 0px;
}

.numberClass
{
  font-size: 14px;
  color: #413839;
  text-align: right;
  width: 2px;
}

.textClass
{
  font-size: 14px;
  color: #413839;
  text-align: left;
}

.dateClass
{
  font-size: 14px;
  color: #413839;
  text-align: left;
  width: 130px;
  white-space: nowrap;
}
/* Added by Sainath T on 19/09/18-end */
.dropdownlist {
	background-color: white;
}
/* Changed by Prasad on 12/04/16 [mapping of one excel column to multiple xml columns] END */
.contentDiv
{
	/* margin-top: 5px; */
	border-top: #6cf 2px solid;
	background-color: #fff;
	padding: 10px 12px;
	border-left: 1px solid #E7E1E1;
	border-right: 1px solid #E7E1E1;
  	border-bottom: 1px solid #E7E1E1;
 	overflow: auto;
  /* height: 366px; */
}

.popup
{
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.4) !important;
	border: 2px solid rgba(2, 2, 2, 0.4);
	background: #fff !important;
	width: 96%;
	height: 93%;
	position: relative;
	z-index: 2;
	left: 20px;
	top: 20px;
	position: absolute;
	overflow: visible;
}

.close
{
	background: #606061;
	color: #fff;
	position: absolute;
	text-align: center;
	text-decoration: none;
	font-weight: bold;
	-moz-border-radius: 12px;
	border-radius: 12px;
	-moz-box-shadow: 1px 1px 3px #000;
	box-shadow: 1px 1px 3px #000;
	cursor: pointer;
	z-index: 1;
	top: -7px;
	line-height: 14px;
	width: 14px;
	left: -10px;
	padding-top: 1px;
	font-size: 10px;
	border: 2px solid white;
	text-transform: uppercase;
}
.pophelp-headerTitle-blue
{
  color: #7bc6ff !important;
}

.pophelp-headerTitle
{
  height: 28px;
  padding: 10px;
  position: absolute;
  padding: 10px 0 0px 10px;
  color: #5893bf !important;
  font-family: Arial, Helvetica, Helvetica Neue, Verdana, sans-serif;
  font-size: 18px;
  text-rendering: optimizeLegibility;
  text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
}

.pophelp-Header
{
  width: 100%;
  top: 0;
  overflow: hidden;
  background-color: white;
  background: white;
  z-index: 1;
  height: 40px;
  padding-right: 0;
  position: relative;
}

.headerPage-Container, .footerPage-Container
{
  position: relative;
  margin: 0px auto;
  background-color: white;
  background-color: rgba(255, 255, 255, .5);
  background: white;
}

.pophelpTransactionEffect
{
	float: right;
	margin-top: -20px;
	cursor: pointer;
	color: rgba(148, 144, 143, 0.96);
	font-size: 14px;
	position: relative;
}

.titleDBR
{
	font-size: 14px;
}

.e12CustomInputPanel
{
	width: 99%;
	height: 42px;
	padding-top: 1px;
	overflow: visible !important;
}

.responsivePnlWidth
{
	width: 97%;
}

.fontstylewidget
{
	font-size: small;
	font-weight: normal;
}

.textBox1, .dateBoxStyle, .numberTextBox1
{
	border: 1px solid lightgray;
	background-color: #fff;
	font-size: 12px;
	text-align: left;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
	text-rendering: optimizeLegibility;
	padding: 2px;
	outline: none;
}

.disabled-field
{
	border: none;
	color: #2087fc;
	background-color: transparent;
	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
	text-rendering: optimizeLegibility;
	font-size: 12px;
	padding-right: 5px;
	-webkit-appearance: none;
}

.gwtTextFieldEditor
{
	width: 97%;
	border-bottom: 1px solid #dbdbdb;
	border-top: none;
	border-left: none;
	border-right: none;
	font-size: small;
	box-sizing: border-box;
	padding: 0 5px 0 0;
	position: relative;
	background-color: transparent;
	margin: 0 5px;
	font-weight: normal;
	border-radius: 0;
	margin-bottom: -7px;
	margin-top: 2px;
	line-height: 0;
}

.gwtTextFieldEditor:focus+.gwtLabelflickerEditor, .gwtTextFieldEditor:valid+.gwtLabelflickerEditor,
	.gwtTextAreaStyleEditor:focus+.gwtLabelflickerEditor,
	.gwtTextAreaStyleEditor:valid+.gwtLabelflickerEditor,
	.gwtDateFieldEditor:focus+.dateBoxLabel, .gwtDateFieldEditor:valid+.dateBoxLabel,
	.gwtDateFieldEditor:focus+.gwtLabelflickerEditor, .gwtDateFieldEditor:valid+.gwtLabelflickerEditor,
	.labelflickerFixPosition {
	outline: none;
	color: #18aa8d !important;
	font-size: small;
	font-weight: normal;
	transform: translateY(-14px);
	-webkit-transform: translateY(-17px);
}

.gwtLabelflickerEditor
{
	-webkit-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	padding: 5px;
	display: block;
	position: absolute;
	margin-top: -20px;
	width: 100%;
	font-size: small;
	font-weight: normal;
	pointer-events: none;
	line-height: 7px;
	/*-webkit-backface-visibility: hidden;*/
}

.label1, .e12-TextBox-readonly
{
	font-weight: lighter;
	text-align: left;
	position: relative;
	color: #62412e;
	/* font-size: 12px; */
	text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
	text-rendering: optimizeLegibility;
	white-space: pre-wrap;
}

.materializedListBoxEditor {
	display: block;
	background: white;
	outline: none;
	-moz-outline: none;
	outline-color: transparent;
	font-weight: lighter;
	font-size: small;
	box-sizing: border-box;
	position: relative;
	background-color: transparent;
	border: 1px solid;
	border-top-color: #fff;
	border-left-color: #fff;
	border-right-color: #fff;
	border-bottom-color: #ccc;
	border-radius: 0;
	-webkit-appearance: menulist !important;
	height: 18px;
}

.listBoxlblPosition
{
	outline: none;
	color: #18aa8d !important;
	font-size: small;
	font-weight: normal;
	padding-left: 5px;
	margin-top: -14px;
}

.noHeadingCss
{
	padding: 0 10px 0 0;
}

.wizTransPophelpImg
{
	height: 15px;
	width: 15px;
	overflow: hidden;
	background: url(/ibase/webitm/images/pop_help_image.png) -0px -0px
		no-repeat;
}

.gwtPopUpTxtLabel
{
	position: relative;
	padding: 0;
	margin-top: -20px;
	float: right;
	cursor: pointer;
}

.selected-feed
{
	background-color: #fff7d4;
}

/*Added by Prasad on 05/12/17 [to display download image] START*/
.downloadTempImg {
	height: 30px;
	width: 15px;
	overflow: hidden;
	cursor: pointer;
	background: url(/ibase/webitm/images/download_attach.png) -0px -0px
		no-repeat;
}
/*Added by Prasad on 05/12/17 [to display download image] END*/

/* Style the tab */
.tab {
	overflow: hidden;
	/* border: 1px solid #ccc; */
	border: none;
	/* background-color: #f1f1f1; */
}

/* Style the buttons inside the tab */
.tabButton {
	background-color: inherit;
	float: left;
	border: none;
	outline: none;
	cursor: pointer;
	padding: 10px 16px;
	transition: 0.3s;
}

/* Create an active/current tablink class */
.tabButton.active
{
	/* background-color: #ccc; */
	border: 1px solid #ccc;
	border-bottom: none;
	font-weight: bold;
}

/* Style the tab content */
.tabcontent {
	/* display: none; */
	padding: 6px 12px;
	/* border: 1px solid #ccc; */
	/* border-top: #6cf 2px solid; */
	border-left: 1px solid #E7E1E1;
	border-right: 1px solid #E7E1E1;
	border-bottom: 1px solid #E7E1E1;
	/* border-top: none; */
}

.tabcontent-red
{
	border-top: #fda786 2px solid;
}

.tabcontent-green {
	border-top: #18aa8d 2px solid;
}

.tabcontent-violet {
	border-top: #b4adee 2px solid;
}

.tabcontent-gray {
	border-top: #666 2px solid;
}

.tabcontent-blue {
	border-top: #6cf 2px solid;
}

.FloatingActionBtn {
	width: 30px;
	height: 30px;
	border-radius: 50%;
/* 	background: #56615D; */
	background-color:var(--primary);
	position: absolute;
	cursor: pointer;
/* 	box-shadow: 0px 2px 5px #666; */
	z-index: 0;
	float: right;
	margin-left: 195px;
	/* top: -20px; */
	margin-top: -45px;
	top: 15;
}

.FloatingActionBtnImg {
	color: #FFF;
	position: relative;
	margin-top: 11px;
	display: block;
	text-align: center;
	line-height: 35px;
	font-size: 24px;
	height: 40px;
	width: 40px;
	font-family: "Roboto";
	font-weight: 300;
}

.removeTemplateBtn {
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: red;
	position: relative;
	bottom: 30px;
	cursor: pointer;
	box-shadow: 0px 2px 5px #666;
	z-index: 1;
	float: right;
	display: none;
	right: 5;
}

.plus, .cross {
	color: #FFF;
	position: relative;
	top: 0px;
	display: block;
	bottom: 0px;
	left: 0px;
	right: 0px;
	text-align: center;
	padding: 0px;
	margin: 0px;
	line-height: 30px;
	font-family: "Roboto";
	font-weight: bold;
}

.listTr {
	height: 45px;
	vertical-align: top;
	cursor: pointer;
}

.listTemplateName {
	font-size: 15px;
}

.listTemplateSubName {
	font-size: 13px;
	color: #999999;
}

/* Uplaod Status - START */
.dahsboardHeaderImg {
	background-color: #717171;
	border-radius: 50% !important;
	/* Changed by Pooja S on [12-July-19] */
	height: 32px;
	width: 32px;
}

.uploadStatusIcon {
	position: absolute;
	padding-left: 3px;
	padding-top: 4px;
}

.bacthIcon {
	background-color: #bebebe !important;
}

.dahsboardHeaderTitle {
	text-align: left;
	/* height: 10%;
	padding-right: 48%;
	position: absolute; */
}

.dahsboardHeaderSubTitle {
	font-size: 12px;
	color: #666;
}

.dahsboardHeaderTbl {
	background-color: white;
	border: 1px solid #f0f0f0;
	width: 100%;
	border-top: none !important;
}

.dahsboardHeaderTblStatus {
	background-color: white;
	border-right: 1px solid #f0f0f0;
	border-left: 1px solid #f0f0f0;
	border-bottom: 1px solid #f0f0f0;
	width: 100%;
	border-top: 2px solid #7bc6ff;
}

.uploadStatusDiv {
	position: relative;
  	z-index: 0 !important;
  	background-color: #ffff; /*Commented By Vikas Lagad on 03-Oct-2019*/
	/* margin-top: 5px; */
}

.dahsboardHeaderBorder {
	border-top: 1px solid #2087fc !important;
}
/* Uplaod Status - END */

/* Uplaod detail - START */
.article {
	min-height: 20px;
}

.p {
	margin: 0;
	line-height: 20px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
}

.protectDiv {
    pointer-events: none;
    opacity: 0.6;
}
/* Uplaod detail - END */

/* Added By Ravindra C on 26-04-18 for template mapping Save Button - Start */
/* .saveEnabled {
	opacity: 0.3;
    background-color: #ddd !important;
}

.cancelTempImg {
	height: 30px;
	width: 25px;
	overflow: hidden;
	margin-left: 10px;
	cursor: pointer;
	background: url(/ibase/webitm/images/cancel_temp_sel.png) -0px -0px no-repeat;
	background-size: 16px 16px;
	background-color: #fff;
} */
/* Added By Ravindra C on 26-04-18 for template mapping Save Button - End */

/*circle progress css-start */
.rect-auto,
.c100.p51 .slice,
.c100.p52 .slice,
.c100.p53 .slice,
.c100.p54 .slice,
.c100.p55 .slice,
.c100.p56 .slice,
.c100.p57 .slice,
.c100.p58 .slice,
.c100.p59 .slice,
.c100.p60 .slice,
.c100.p61 .slice,
.c100.p62 .slice,
.c100.p63 .slice,
.c100.p64 .slice,
.c100.p65 .slice,
.c100.p66 .slice,
.c100.p67 .slice,
.c100.p68 .slice,
.c100.p69 .slice,
.c100.p70 .slice,
.c100.p71 .slice,
.c100.p72 .slice,
.c100.p73 .slice,
.c100.p74 .slice,
.c100.p75 .slice,
.c100.p76 .slice,
.c100.p77 .slice,
.c100.p78 .slice,
.c100.p79 .slice,
.c100.p80 .slice,
.c100.p81 .slice,
.c100.p82 .slice,
.c100.p83 .slice,
.c100.p84 .slice,
.c100.p85 .slice,
.c100.p86 .slice,
.c100.p87 .slice,
.c100.p88 .slice,
.c100.p89 .slice,
.c100.p90 .slice,
.c100.p91 .slice,
.c100.p92 .slice,
.c100.p93 .slice,
.c100.p94 .slice,
.c100.p95 .slice,
.c100.p96 .slice,
.c100.p97 .slice,
.c100.p98 .slice,
.c100.p99 .slice,
.c100.p100 .slice {
  clip: rect(auto, auto, auto, auto);
}
.pie,
.c100 .bar,
.c100.p51 .fill,
.c100.p52 .fill,
.c100.p53 .fill,
.c100.p54 .fill,
.c100.p55 .fill,
.c100.p56 .fill,
.c100.p57 .fill,
.c100.p58 .fill,
.c100.p59 .fill,
.c100.p60 .fill,
.c100.p61 .fill,
.c100.p62 .fill,
.c100.p63 .fill,
.c100.p64 .fill,
.c100.p65 .fill,
.c100.p66 .fill,
.c100.p67 .fill,
.c100.p68 .fill,
.c100.p69 .fill,
.c100.p70 .fill,
.c100.p71 .fill,
.c100.p72 .fill,
.c100.p73 .fill,
.c100.p74 .fill,
.c100.p75 .fill,
.c100.p76 .fill,
.c100.p77 .fill,
.c100.p78 .fill,
.c100.p79 .fill,
.c100.p80 .fill,
.c100.p81 .fill,
.c100.p82 .fill,
.c100.p83 .fill,
.c100.p84 .fill,
.c100.p85 .fill,
.c100.p86 .fill,
.c100.p87 .fill,
.c100.p88 .fill,
.c100.p89 .fill,
.c100.p90 .fill,
.c100.p91 .fill,
.c100.p92 .fill,
.c100.p93 .fill,
.c100.p94 .fill,
.c100.p95 .fill,
.c100.p96 .fill,
.c100.p97 .fill,
.c100.p98 .fill,
.c100.p99 .fill,
.c100.p100 .fill

{
  position: absolute;
  /* border: 0.08em solid #307bbb; */
  border: 0.08em solid yellow;
  width: 0.84em;
  height: 0.84em;
  clip: rect(0em, 0.5em, 1em, 0em);
  border-radius: 50%;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}
.pie-fill,
.c100.p51 .bar:after,
.c100.p51 .fill,
.c100.p52 .bar:after,
.c100.p52 .fill,
.c100.p53 .bar:after,
.c100.p53 .fill,
.c100.p54 .bar:after,
.c100.p54 .fill,
.c100.p55 .bar:after,
.c100.p55 .fill,
.c100.p56 .bar:after,
.c100.p56 .fill,
.c100.p57 .bar:after,
.c100.p57 .fill,
.c100.p58 .bar:after,
.c100.p58 .fill,
.c100.p59 .bar:after,
.c100.p59 .fill,
.c100.p60 .bar:after,
.c100.p60 .fill,
.c100.p61 .bar:after,
.c100.p61 .fill,
.c100.p62 .bar:after,
.c100.p62 .fill,
.c100.p63 .bar:after,
.c100.p63 .fill,
.c100.p64 .bar:after,
.c100.p64 .fill,
.c100.p65 .bar:after,
.c100.p65 .fill,
.c100.p66 .bar:after,
.c100.p66 .fill,
.c100.p67 .bar:after,
.c100.p67 .fill,
.c100.p68 .bar:after,
.c100.p68 .fill,
.c100.p69 .bar:after,
.c100.p69 .fill,
.c100.p70 .bar:after,
.c100.p70 .fill,
.c100.p71 .bar:after,
.c100.p71 .fill,
.c100.p72 .bar:after,
.c100.p72 .fill,
.c100.p73 .bar:after,
.c100.p73 .fill,
.c100.p74 .bar:after,
.c100.p74 .fill,
.c100.p75 .bar:after,
.c100.p75 .fill,
.c100.p76 .bar:after,
.c100.p76 .fill,
.c100.p77 .bar:after,
.c100.p77 .fill,
.c100.p78 .bar:after,
.c100.p78 .fill,
.c100.p79 .bar:after,
.c100.p79 .fill,
.c100.p80 .bar:after,
.c100.p80 .fill,
.c100.p81 .bar:after,
.c100.p81 .fill,
.c100.p82 .bar:after,
.c100.p82 .fill,
.c100.p83 .bar:after,
.c100.p83 .fill,
.c100.p84 .bar:after,
.c100.p84 .fill,
.c100.p85 .bar:after,
.c100.p85 .fill,
.c100.p86 .bar:after,
.c100.p86 .fill,
.c100.p87 .bar:after,
.c100.p87 .fill,
.c100.p88 .bar:after,
.c100.p88 .fill,
.c100.p89 .bar:after,
.c100.p89 .fill,
.c100.p90 .bar:after,
.c100.p90 .fill,
.c100.p91 .bar:after,
.c100.p91 .fill,
.c100.p92 .bar:after,
.c100.p92 .fill,
.c100.p93 .bar:after,
.c100.p93 .fill,
.c100.p94 .bar:after,
.c100.p94 .fill,
.c100.p95 .bar:after,
.c100.p95 .fill,
.c100.p96 .bar:after,
.c100.p96 .fill,
.c100.p97 .bar:after,
.c100.p97 .fill,
.c100.p98 .bar:after,
.c100.p98 .fill,
.c100.p99 .bar:after,
.c100.p99 .fill,
.c100.p100 .bar:after,
.c100.p100 .fill {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
.c100 {
  position: relative;
/*   font-size: 92px; */
	font-size: 42px;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  /* float: left; */
  /* margin: 0 0.1em 0.1em 0; */
  margin: 0 auto;
  background-color: #cccccc;
}
.c100 *,
.c100 *:before,
.c100 *:after {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.c100.center {
  float: none;
  margin: 0 auto;
}
.c100.big {
  font-size: 240px;
}
.c100.small {
  font-size: 80px;
}

.c100 > span {
    position: absolute;
    width: 100%;
    z-index: 1;
    left: 14px;
    top: 22px;
    font-size: 13px;
    color: #cccccc;
    display: block;
    text-align: center;
    white-space: nowrap;
    -webkit-transition-property: all;
    -moz-transition-property: all;
    -o-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    -o-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.c100:after {
  position: absolute;
  top: 0.08em;
  left: 0.08em;
  display: block;
  content: " ";
  border-radius: 50%;
  background-color: #FFF;
  width: 0.84em;
  height: 0.84em;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-timing-function: ease-in;
  -moz-transition-timing-function: ease-in;
  -o-transition-timing-function: ease-in;
  transition-timing-function: ease-in;
}
.c100 .slice {
  position: absolute;
  width: 1em;
  height: 1em;
  clip: rect(0em, 1em, 1em, 0.5em);
}
.c100.p1 .bar {
  -webkit-transform: rotate(3.6deg);
  -moz-transform: rotate(3.6deg);
  -ms-transform: rotate(3.6deg);
  -o-transform: rotate(3.6deg);
  transform: rotate(3.6deg);
}
.c100.p2 .bar {
  -webkit-transform: rotate(7.2deg);
  -moz-transform: rotate(7.2deg);
  -ms-transform: rotate(7.2deg);
  -o-transform: rotate(7.2deg);
  transform: rotate(7.2deg);
}
.c100.p3 .bar {
  -webkit-transform: rotate(10.8deg);
  -moz-transform: rotate(10.8deg);
  -ms-transform: rotate(10.8deg);
  -o-transform: rotate(10.8deg);
  transform: rotate(10.8deg);
}
.c100.p4 .bar {
  -webkit-transform: rotate(14.4deg);
  -moz-transform: rotate(14.4deg);
  -ms-transform: rotate(14.4deg);
  -o-transform: rotate(14.4deg);
  transform: rotate(14.4deg);
}
.c100.p5 .bar {
  -webkit-transform: rotate(18deg);
  -moz-transform: rotate(18deg);
  -ms-transform: rotate(18deg);
  -o-transform: rotate(18deg);
  transform: rotate(18deg);
}
.c100.p6 .bar {
  -webkit-transform: rotate(21.6deg);
  -moz-transform: rotate(21.6deg);
  -ms-transform: rotate(21.6deg);
  -o-transform: rotate(21.6deg);
  transform: rotate(21.6deg);
}
.c100.p7 .bar {
  -webkit-transform: rotate(25.2deg);
  -moz-transform: rotate(25.2deg);
  -ms-transform: rotate(25.2deg);
  -o-transform: rotate(25.2deg);
  transform: rotate(25.2deg);
}
.c100.p8 .bar {
  -webkit-transform: rotate(28.8deg);
  -moz-transform: rotate(28.8deg);
  -ms-transform: rotate(28.8deg);
  -o-transform: rotate(28.8deg);
  transform: rotate(28.8deg);
}
.c100.p9 .bar {
  -webkit-transform: rotate(32.4deg);
  -moz-transform: rotate(32.4deg);
  -ms-transform: rotate(32.4deg);
  -o-transform: rotate(32.4deg);
  transform: rotate(32.4deg);
}
.c100.p10 .bar {
  -webkit-transform: rotate(36deg);
  -moz-transform: rotate(36deg);
  -ms-transform: rotate(36deg);
  -o-transform: rotate(36deg);
  transform: rotate(36deg);
}
.c100.p11 .bar {
  -webkit-transform: rotate(39.6deg);
  -moz-transform: rotate(39.6deg);
  -ms-transform: rotate(39.6deg);
  -o-transform: rotate(39.6deg);
  transform: rotate(39.6deg);
}
.c100.p12 .bar {
  -webkit-transform: rotate(43.2deg);
  -moz-transform: rotate(43.2deg);
  -ms-transform: rotate(43.2deg);
  -o-transform: rotate(43.2deg);
  transform: rotate(43.2deg);
}
.c100.p13 .bar {
  -webkit-transform: rotate(46.800000000000004deg);
  -moz-transform: rotate(46.800000000000004deg);
  -ms-transform: rotate(46.800000000000004deg);
  -o-transform: rotate(46.800000000000004deg);
  transform: rotate(46.800000000000004deg);
}
.c100.p14 .bar {
  -webkit-transform: rotate(50.4deg);
  -moz-transform: rotate(50.4deg);
  -ms-transform: rotate(50.4deg);
  -o-transform: rotate(50.4deg);
  transform: rotate(50.4deg);
}
.c100.p15 .bar {
  -webkit-transform: rotate(54deg);
  -moz-transform: rotate(54deg);
  -ms-transform: rotate(54deg);
  -o-transform: rotate(54deg);
  transform: rotate(54deg);
}
.c100.p16 .bar {
  -webkit-transform: rotate(57.6deg);
  -moz-transform: rotate(57.6deg);
  -ms-transform: rotate(57.6deg);
  -o-transform: rotate(57.6deg);
  transform: rotate(57.6deg);
}
.c100.p17 .bar {
  -webkit-transform: rotate(61.2deg);
  -moz-transform: rotate(61.2deg);
  -ms-transform: rotate(61.2deg);
  -o-transform: rotate(61.2deg);
  transform: rotate(61.2deg);
}
.c100.p18 .bar {
  -webkit-transform: rotate(64.8deg);
  -moz-transform: rotate(64.8deg);
  -ms-transform: rotate(64.8deg);
  -o-transform: rotate(64.8deg);
  transform: rotate(64.8deg);
}
.c100.p19 .bar {
  -webkit-transform: rotate(68.4deg);
  -moz-transform: rotate(68.4deg);
  -ms-transform: rotate(68.4deg);
  -o-transform: rotate(68.4deg);
  transform: rotate(68.4deg);
}
.c100.p20 .bar {
  -webkit-transform: rotate(72deg);
  -moz-transform: rotate(72deg);
  -ms-transform: rotate(72deg);
  -o-transform: rotate(72deg);
  transform: rotate(72deg);
}
.c100.p21 .bar {
  -webkit-transform: rotate(75.60000000000001deg);
  -moz-transform: rotate(75.60000000000001deg);
  -ms-transform: rotate(75.60000000000001deg);
  -o-transform: rotate(75.60000000000001deg);
  transform: rotate(75.60000000000001deg);
}
.c100.p22 .bar {
  -webkit-transform: rotate(79.2deg);
  -moz-transform: rotate(79.2deg);
  -ms-transform: rotate(79.2deg);
  -o-transform: rotate(79.2deg);
  transform: rotate(79.2deg);
}
.c100.p23 .bar {
  -webkit-transform: rotate(82.8deg);
  -moz-transform: rotate(82.8deg);
  -ms-transform: rotate(82.8deg);
  -o-transform: rotate(82.8deg);
  transform: rotate(82.8deg);
}
.c100.p24 .bar {
  -webkit-transform: rotate(86.4deg);
  -moz-transform: rotate(86.4deg);
  -ms-transform: rotate(86.4deg);
  -o-transform: rotate(86.4deg);
  transform: rotate(86.4deg);
}
.c100.p25 .bar {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}
.c100.p26 .bar {
  -webkit-transform: rotate(93.60000000000001deg);
  -moz-transform: rotate(93.60000000000001deg);
  -ms-transform: rotate(93.60000000000001deg);
  -o-transform: rotate(93.60000000000001deg);
  transform: rotate(93.60000000000001deg);
}
.c100.p27 .bar {
  -webkit-transform: rotate(97.2deg);
  -moz-transform: rotate(97.2deg);
  -ms-transform: rotate(97.2deg);
  -o-transform: rotate(97.2deg);
  transform: rotate(97.2deg);
}
.c100.p28 .bar {
  -webkit-transform: rotate(100.8deg);
  -moz-transform: rotate(100.8deg);
  -ms-transform: rotate(100.8deg);
  -o-transform: rotate(100.8deg);
  transform: rotate(100.8deg);
}
.c100.p29 .bar {
  -webkit-transform: rotate(104.4deg);
  -moz-transform: rotate(104.4deg);
  -ms-transform: rotate(104.4deg);
  -o-transform: rotate(104.4deg);
  transform: rotate(104.4deg);
}
.c100.p30 .bar {
  -webkit-transform: rotate(108deg);
  -moz-transform: rotate(108deg);
  -ms-transform: rotate(108deg);
  -o-transform: rotate(108deg);
  transform: rotate(108deg);
}
.c100.p31 .bar {
  -webkit-transform: rotate(111.60000000000001deg);
  -moz-transform: rotate(111.60000000000001deg);
  -ms-transform: rotate(111.60000000000001deg);
  -o-transform: rotate(111.60000000000001deg);
  transform: rotate(111.60000000000001deg);
}
.c100.p32 .bar {
  -webkit-transform: rotate(115.2deg);
  -moz-transform: rotate(115.2deg);
  -ms-transform: rotate(115.2deg);
  -o-transform: rotate(115.2deg);
  transform: rotate(115.2deg);
}
.c100.p33 .bar {
  -webkit-transform: rotate(118.8deg);
  -moz-transform: rotate(118.8deg);
  -ms-transform: rotate(118.8deg);
  -o-transform: rotate(118.8deg);
  transform: rotate(118.8deg);
}
.c100.p34 .bar {
  -webkit-transform: rotate(122.4deg);
  -moz-transform: rotate(122.4deg);
  -ms-transform: rotate(122.4deg);
  -o-transform: rotate(122.4deg);
  transform: rotate(122.4deg);
}
.c100.p35 .bar {
  -webkit-transform: rotate(126deg);
  -moz-transform: rotate(126deg);
  -ms-transform: rotate(126deg);
  -o-transform: rotate(126deg);
  transform: rotate(126deg);
}
.c100.p36 .bar {
  -webkit-transform: rotate(129.6deg);
  -moz-transform: rotate(129.6deg);
  -ms-transform: rotate(129.6deg);
  -o-transform: rotate(129.6deg);
  transform: rotate(129.6deg);
}
.c100.p37 .bar {
  -webkit-transform: rotate(133.20000000000002deg);
  -moz-transform: rotate(133.20000000000002deg);
  -ms-transform: rotate(133.20000000000002deg);
  -o-transform: rotate(133.20000000000002deg);
  transform: rotate(133.20000000000002deg);
}
.c100.p38 .bar {
  -webkit-transform: rotate(136.8deg);
  -moz-transform: rotate(136.8deg);
  -ms-transform: rotate(136.8deg);
  -o-transform: rotate(136.8deg);
  transform: rotate(136.8deg);
}
.c100.p39 .bar {
  -webkit-transform: rotate(140.4deg);
  -moz-transform: rotate(140.4deg);
  -ms-transform: rotate(140.4deg);
  -o-transform: rotate(140.4deg);
  transform: rotate(140.4deg);
}
.c100.p40 .bar {
  -webkit-transform: rotate(144deg);
  -moz-transform: rotate(144deg);
  -ms-transform: rotate(144deg);
  -o-transform: rotate(144deg);
  transform: rotate(144deg);
}
.c100.p41 .bar {
  -webkit-transform: rotate(147.6deg);
  -moz-transform: rotate(147.6deg);
  -ms-transform: rotate(147.6deg);
  -o-transform: rotate(147.6deg);
  transform: rotate(147.6deg);
}
.c100.p42 .bar {
  -webkit-transform: rotate(151.20000000000002deg);
  -moz-transform: rotate(151.20000000000002deg);
  -ms-transform: rotate(151.20000000000002deg);
  -o-transform: rotate(151.20000000000002deg);
  transform: rotate(151.20000000000002deg);
}
.c100.p43 .bar {
  -webkit-transform: rotate(154.8deg);
  -moz-transform: rotate(154.8deg);
  -ms-transform: rotate(154.8deg);
  -o-transform: rotate(154.8deg);
  transform: rotate(154.8deg);
}
.c100.p44 .bar {
  -webkit-transform: rotate(158.4deg);
  -moz-transform: rotate(158.4deg);
  -ms-transform: rotate(158.4deg);
  -o-transform: rotate(158.4deg);
  transform: rotate(158.4deg);
}
.c100.p45 .bar {
  -webkit-transform: rotate(162deg);
  -moz-transform: rotate(162deg);
  -ms-transform: rotate(162deg);
  -o-transform: rotate(162deg);
  transform: rotate(162deg);
}
.c100.p46 .bar {
  -webkit-transform: rotate(165.6deg);
  -moz-transform: rotate(165.6deg);
  -ms-transform: rotate(165.6deg);
  -o-transform: rotate(165.6deg);
  transform: rotate(165.6deg);
}
.c100.p47 .bar {
  -webkit-transform: rotate(169.20000000000002deg);
  -moz-transform: rotate(169.20000000000002deg);
  -ms-transform: rotate(169.20000000000002deg);
  -o-transform: rotate(169.20000000000002deg);
  transform: rotate(169.20000000000002deg);
}
.c100.p48 .bar {
  -webkit-transform: rotate(172.8deg);
  -moz-transform: rotate(172.8deg);
  -ms-transform: rotate(172.8deg);
  -o-transform: rotate(172.8deg);
  transform: rotate(172.8deg);
}
.c100.p49 .bar {
  -webkit-transform: rotate(176.4deg);
  -moz-transform: rotate(176.4deg);
  -ms-transform: rotate(176.4deg);
  -o-transform: rotate(176.4deg);
  transform: rotate(176.4deg);
}
.c100.p50 .bar {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
.c100.p51 .bar {
  -webkit-transform: rotate(183.6deg);
  -moz-transform: rotate(183.6deg);
  -ms-transform: rotate(183.6deg);
  -o-transform: rotate(183.6deg);
  transform: rotate(183.6deg);
}
.c100.p52 .bar {
  -webkit-transform: rotate(187.20000000000002deg);
  -moz-transform: rotate(187.20000000000002deg);
  -ms-transform: rotate(187.20000000000002deg);
  -o-transform: rotate(187.20000000000002deg);
  transform: rotate(187.20000000000002deg);
}
.c100.p53 .bar {
  -webkit-transform: rotate(190.8deg);
  -moz-transform: rotate(190.8deg);
  -ms-transform: rotate(190.8deg);
  -o-transform: rotate(190.8deg);
  transform: rotate(190.8deg);
}
.c100.p54 .bar {
  -webkit-transform: rotate(194.4deg);
  -moz-transform: rotate(194.4deg);
  -ms-transform: rotate(194.4deg);
  -o-transform: rotate(194.4deg);
  transform: rotate(194.4deg);
}
.c100.p55 .bar {
  -webkit-transform: rotate(198deg);
  -moz-transform: rotate(198deg);
  -ms-transform: rotate(198deg);
  -o-transform: rotate(198deg);
  transform: rotate(198deg);
}
.c100.p56 .bar {
  -webkit-transform: rotate(201.6deg);
  -moz-transform: rotate(201.6deg);
  -ms-transform: rotate(201.6deg);
  -o-transform: rotate(201.6deg);
  transform: rotate(201.6deg);
}
.c100.p57 .bar {
  -webkit-transform: rotate(205.20000000000002deg);
  -moz-transform: rotate(205.20000000000002deg);
  -ms-transform: rotate(205.20000000000002deg);
  -o-transform: rotate(205.20000000000002deg);
  transform: rotate(205.20000000000002deg);
}
.c100.p58 .bar {
  -webkit-transform: rotate(208.8deg);
  -moz-transform: rotate(208.8deg);
  -ms-transform: rotate(208.8deg);
  -o-transform: rotate(208.8deg);
  transform: rotate(208.8deg);
}
.c100.p59 .bar {
  -webkit-transform: rotate(212.4deg);
  -moz-transform: rotate(212.4deg);
  -ms-transform: rotate(212.4deg);
  -o-transform: rotate(212.4deg);
  transform: rotate(212.4deg);
}
.c100.p60 .bar {
  -webkit-transform: rotate(216deg);
  -moz-transform: rotate(216deg);
  -ms-transform: rotate(216deg);
  -o-transform: rotate(216deg);
  transform: rotate(216deg);
}
.c100.p61 .bar {
  -webkit-transform: rotate(219.6deg);
  -moz-transform: rotate(219.6deg);
  -ms-transform: rotate(219.6deg);
  -o-transform: rotate(219.6deg);
  transform: rotate(219.6deg);
}
.c100.p62 .bar {
  -webkit-transform: rotate(223.20000000000002deg);
  -moz-transform: rotate(223.20000000000002deg);
  -ms-transform: rotate(223.20000000000002deg);
  -o-transform: rotate(223.20000000000002deg);
  transform: rotate(223.20000000000002deg);
}
.c100.p63 .bar {
  -webkit-transform: rotate(226.8deg);
  -moz-transform: rotate(226.8deg);
  -ms-transform: rotate(226.8deg);
  -o-transform: rotate(226.8deg);
  transform: rotate(226.8deg);
}
.c100.p64 .bar {
  -webkit-transform: rotate(230.4deg);
  -moz-transform: rotate(230.4deg);
  -ms-transform: rotate(230.4deg);
  -o-transform: rotate(230.4deg);
  transform: rotate(230.4deg);
}
.c100.p65 .bar {
  -webkit-transform: rotate(234deg);
  -moz-transform: rotate(234deg);
  -ms-transform: rotate(234deg);
  -o-transform: rotate(234deg);
  transform: rotate(234deg);
}
.c100.p66 .bar {
  -webkit-transform: rotate(237.6deg);
  -moz-transform: rotate(237.6deg);
  -ms-transform: rotate(237.6deg);
  -o-transform: rotate(237.6deg);
  transform: rotate(237.6deg);
}
.c100.p67 .bar {
  -webkit-transform: rotate(241.20000000000002deg);
  -moz-transform: rotate(241.20000000000002deg);
  -ms-transform: rotate(241.20000000000002deg);
  -o-transform: rotate(241.20000000000002deg);
  transform: rotate(241.20000000000002deg);
}
.c100.p68 .bar {
  -webkit-transform: rotate(244.8deg);
  -moz-transform: rotate(244.8deg);
  -ms-transform: rotate(244.8deg);
  -o-transform: rotate(244.8deg);
  transform: rotate(244.8deg);
}
.c100.p69 .bar {
  -webkit-transform: rotate(248.4deg);
  -moz-transform: rotate(248.4deg);
  -ms-transform: rotate(248.4deg);
  -o-transform: rotate(248.4deg);
  transform: rotate(248.4deg);
}
.c100.p70 .bar {
  -webkit-transform: rotate(252deg);
  -moz-transform: rotate(252deg);
  -ms-transform: rotate(252deg);
  -o-transform: rotate(252deg);
  transform: rotate(252deg);
}
.c100.p71 .bar {
  -webkit-transform: rotate(255.6deg);
  -moz-transform: rotate(255.6deg);
  -ms-transform: rotate(255.6deg);
  -o-transform: rotate(255.6deg);
  transform: rotate(255.6deg);
}
.c100.p72 .bar {
  -webkit-transform: rotate(259.2deg);
  -moz-transform: rotate(259.2deg);
  -ms-transform: rotate(259.2deg);
  -o-transform: rotate(259.2deg);
  transform: rotate(259.2deg);
}
.c100.p73 .bar {
  -webkit-transform: rotate(262.8deg);
  -moz-transform: rotate(262.8deg);
  -ms-transform: rotate(262.8deg);
  -o-transform: rotate(262.8deg);
  transform: rotate(262.8deg);
}
.c100.p74 .bar {
  -webkit-transform: rotate(266.40000000000003deg);
  -moz-transform: rotate(266.40000000000003deg);
  -ms-transform: rotate(266.40000000000003deg);
  -o-transform: rotate(266.40000000000003deg);
  transform: rotate(266.40000000000003deg);
}
.c100.p75 .bar {
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
}
.c100.p76 .bar {
  -webkit-transform: rotate(273.6deg);
  -moz-transform: rotate(273.6deg);
  -ms-transform: rotate(273.6deg);
  -o-transform: rotate(273.6deg);
  transform: rotate(273.6deg);
}
.c100.p77 .bar {
  -webkit-transform: rotate(277.2deg);
  -moz-transform: rotate(277.2deg);
  -ms-transform: rotate(277.2deg);
  -o-transform: rotate(277.2deg);
  transform: rotate(277.2deg);
}
.c100.p78 .bar {
  -webkit-transform: rotate(280.8deg);
  -moz-transform: rotate(280.8deg);
  -ms-transform: rotate(280.8deg);
  -o-transform: rotate(280.8deg);
  transform: rotate(280.8deg);
}
.c100.p79 .bar {
  -webkit-transform: rotate(284.40000000000003deg);
  -moz-transform: rotate(284.40000000000003deg);
  -ms-transform: rotate(284.40000000000003deg);
  -o-transform: rotate(284.40000000000003deg);
  transform: rotate(284.40000000000003deg);
}
.c100.p80 .bar {
  -webkit-transform: rotate(288deg);
  -moz-transform: rotate(288deg);
  -ms-transform: rotate(288deg);
  -o-transform: rotate(288deg);
  transform: rotate(288deg);
}
.c100.p81 .bar {
  -webkit-transform: rotate(291.6deg);
  -moz-transform: rotate(291.6deg);
  -ms-transform: rotate(291.6deg);
  -o-transform: rotate(291.6deg);
  transform: rotate(291.6deg);
}
.c100.p82 .bar {
  -webkit-transform: rotate(295.2deg);
  -moz-transform: rotate(295.2deg);
  -ms-transform: rotate(295.2deg);
  -o-transform: rotate(295.2deg);
  transform: rotate(295.2deg);
}
.c100.p83 .bar {
  -webkit-transform: rotate(298.8deg);
  -moz-transform: rotate(298.8deg);
  -ms-transform: rotate(298.8deg);
  -o-transform: rotate(298.8deg);
  transform: rotate(298.8deg);
}
.c100.p84 .bar {
  -webkit-transform: rotate(302.40000000000003deg);
  -moz-transform: rotate(302.40000000000003deg);
  -ms-transform: rotate(302.40000000000003deg);
  -o-transform: rotate(302.40000000000003deg);
  transform: rotate(302.40000000000003deg);
}
.c100.p85 .bar {
  -webkit-transform: rotate(306deg);
  -moz-transform: rotate(306deg);
  -ms-transform: rotate(306deg);
  -o-transform: rotate(306deg);
  transform: rotate(306deg);
}
.c100.p86 .bar {
  -webkit-transform: rotate(309.6deg);
  -moz-transform: rotate(309.6deg);
  -ms-transform: rotate(309.6deg);
  -o-transform: rotate(309.6deg);
  transform: rotate(309.6deg);
}
.c100.p87 .bar {
  -webkit-transform: rotate(313.2deg);
  -moz-transform: rotate(313.2deg);
  -ms-transform: rotate(313.2deg);
  -o-transform: rotate(313.2deg);
  transform: rotate(313.2deg);
}
.c100.p88 .bar {
  -webkit-transform: rotate(316.8deg);
  -moz-transform: rotate(316.8deg);
  -ms-transform: rotate(316.8deg);
  -o-transform: rotate(316.8deg);
  transform: rotate(316.8deg);
}
.c100.p89 .bar {
  -webkit-transform: rotate(320.40000000000003deg);
  -moz-transform: rotate(320.40000000000003deg);
  -ms-transform: rotate(320.40000000000003deg);
  -o-transform: rotate(320.40000000000003deg);
  transform: rotate(320.40000000000003deg);
}
.c100.p90 .bar {
  -webkit-transform: rotate(324deg);
  -moz-transform: rotate(324deg);
  -ms-transform: rotate(324deg);
  -o-transform: rotate(324deg);
  transform: rotate(324deg);
}
.c100.p91 .bar {
  -webkit-transform: rotate(327.6deg);
  -moz-transform: rotate(327.6deg);
  -ms-transform: rotate(327.6deg);
  -o-transform: rotate(327.6deg);
  transform: rotate(327.6deg);
}
.c100.p92 .bar {
  -webkit-transform: rotate(331.2deg);
  -moz-transform: rotate(331.2deg);
  -ms-transform: rotate(331.2deg);
  -o-transform: rotate(331.2deg);
  transform: rotate(331.2deg);
}
.c100.p93 .bar {
  -webkit-transform: rotate(334.8deg);
  -moz-transform: rotate(334.8deg);
  -ms-transform: rotate(334.8deg);
  -o-transform: rotate(334.8deg);
  transform: rotate(334.8deg);
}
.c100.p94 .bar {
  -webkit-transform: rotate(338.40000000000003deg);
  -moz-transform: rotate(338.40000000000003deg);
  -ms-transform: rotate(338.40000000000003deg);
  -o-transform: rotate(338.40000000000003deg);
  transform: rotate(338.40000000000003deg);
}
.c100.p95 .bar {
  -webkit-transform: rotate(342deg);
  -moz-transform: rotate(342deg);
  -ms-transform: rotate(342deg);
  -o-transform: rotate(342deg);
  transform: rotate(342deg);
}
.c100.p96 .bar {
  -webkit-transform: rotate(345.6deg);
  -moz-transform: rotate(345.6deg);
  -ms-transform: rotate(345.6deg);
  -o-transform: rotate(345.6deg);
  transform: rotate(345.6deg);
}
.c100.p97 .bar {
  -webkit-transform: rotate(349.2deg);
  -moz-transform: rotate(349.2deg);
  -ms-transform: rotate(349.2deg);
  -o-transform: rotate(349.2deg);
  transform: rotate(349.2deg);
}
.c100.p98 .bar {
  -webkit-transform: rotate(352.8deg);
  -moz-transform: rotate(352.8deg);
  -ms-transform: rotate(352.8deg);
  -o-transform: rotate(352.8deg);
  transform: rotate(352.8deg);
}
.c100.p99 .bar {
  -webkit-transform: rotate(356.40000000000003deg);
  -moz-transform: rotate(356.40000000000003deg);
  -ms-transform: rotate(356.40000000000003deg);
  -o-transform: rotate(356.40000000000003deg);
  transform: rotate(356.40000000000003deg);
}
.c100.p100 .bar {
  -webkit-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  -o-transform: rotate(360deg);
  transform: rotate(360deg);
}
.c100:hover {
  cursor: default;
}
.c100:hover > span {
  /* width: 3.33em;
  line-height: 3.33em;
  font-size: 0.3em;
  color: #307bbb; */
  width: 4.33em;
  /* line-height: 3.33em; */
  font-size: 16px;
  /* color: #307bbb; */
  color: yellow;
  text-align: center;
  top: 20px;
  left :15px;


}
.c100:hover:after {
  top: 0.04em;
  left: 0.04em;
  width: 0.92em;
  height: 0.92em;
}
.c100.dark {
  background-color: #777777;
}
.c100.dark .bar,
.c100.dark .fill {
  border-color: #c6ff00 !important;
}
.c100.dark > span {
  color: #777777;
}
.c100.dark:after {
  background-color: #666666;
}
.c100.dark:hover > span {
  color: #c6ff00;
}
.c100.green .bar,
.c100.green .fill
{
  border-color: #4db53c !important;
}
.c100.green:hover > span
{
  color: #4db53c;
}
.c100.green.dark .bar,
.c100.green.dark .fill
 {
  border-color: #5fd400 !important;
}
.c100.green.dark:hover > span {
  color: #5fd400;
}
.c100.orange .bar,
.c100.orange .fill {
  border-color: #dd9d22 !important;
}
.c100.orange:hover > span {
  color: #dd9d22;
}
.c100.orange.dark .bar,
.c100.orange.dark .fill {
  border-color: #e08833 !important;
}
.c100.orange.dark:hover > span {
  color: #e08833;
}
.c100.yellow:hover > span {
  color: yellow;
}

.c100.p5.yellow .bar,
.c100.p5.yellow .fill
{
  border-color: yellow !important;
}

.c100.p20.yellow .bar,
.c100.p20.yellow .fill
{
  border-color: yellow !important;
}

.c100.p80.yellow .bar,
.c100.p80.yellow .fill
{
  border-color: yellow !important;
}

.c100.p15.yellow .bar,
.c100.p15.yellow .fill
{
  border-color: yellow !important;
}

.c100.p40.yellow .bar,
.c100.p40.yellow .fill
{
  border-color: yellow !important;
}

.c100.p60.yellow .bar,
.c100.p60.yellow .fill
{
  border-color: yellow !important;
}

.c100.p100.red .bar,
.c100.p100.red .fill
{
  border-color: red !important;
}


.rect-auto,
.c100.s51 .slice,
.c100.s52 .slice,
.c100.s53 .slice,
.c100.s54 .slice,
.c100.s55 .slice,
.c100.s56 .slice,
.c100.s57 .slice,
.c100.s58 .slice,
.c100.s59 .slice,
.c100.s60 .slice,
.c100.s61 .slice,
.c100.s62 .slice,
.c100.s63 .slice,
.c100.s64 .slice,
.c100.s65 .slice,
.c100.s66 .slice,
.c100.s67 .slice,
.c100.s68 .slice,
.c100.s69 .slice,
.c100.s70 .slice,
.c100.s71 .slice,
.c100.s72 .slice,
.c100.s73 .slice,
.c100.s74 .slice,
.c100.s75 .slice,
.c100.s76 .slice,
.c100.s77 .slice,
.c100.s78 .slice,
.c100.s79 .slice,
.c100.s80 .slice,
.c100.s81 .slice,
.c100.s82 .slice,
.c100.s83 .slice,
.c100.s84 .slice,
.c100.s85 .slice,
.c100.s86 .slice,
.c100.s87 .slice,
.c100.s88 .slice,
.c100.s89 .slice,
.c100.s90 .slice,
.c100.s91 .slice,
.c100.s92 .slice,
.c100.s93 .slice,
.c100.s94 .slice,
.c100.s95 .slice,
.c100.s96 .slice,
.c100.s97 .slice,
.c100.s98 .slice,
.c100.s99 .slice
{
  clip: rect(auto, auto, auto, auto);
}

.pie,
.c100 .bar,
.c100.s51 .fill,
.c100.s52 .fill,
.c100.s53 .fill,
.c100.s54 .fill,
.c100.s55 .fill,
.c100.s56 .fill,
.c100.s57 .fill,
.c100.s58 .fill,
.c100.s59 .fill,
.c100.s60 .fill,
.c100.s61 .fill,
.c100.s62 .fill,
.c100.s63 .fill,
.c100.s64 .fill,
.c100.s65 .fill,
.c100.s66 .fill,
.c100.s67 .fill,
.c100.s68 .fill,
.c100.s69 .fill,
.c100.s70 .fill,
.c100.s71 .fill,
.c100.s72 .fill,
.c100.s73 .fill,
.c100.s74 .fill,
.c100.s75 .fill,
.c100.s76 .fill,
.c100.s77 .fill,
.c100.s78 .fill,
.c100.s79 .fill,
.c100.s80 .fill,
.c100.s81 .fill,
.c100.s82 .fill,
.c100.s83 .fill,
.c100.s84 .fill,
.c100.s85 .fill,
.c100.s86 .fill,
.c100.s87 .fill,
.c100.s88 .fill,
.c100.s89 .fill,
.c100.s90 .fill,
.c100.s91 .fill,
.c100.s92 .fill,
.c100.s93 .fill,
.c100.s94 .fill,
.c100.s95 .fill,
.c100.s96 .fill,
.c100.s97 .fill,
.c100.s98 .fill,
.c100.s99 .fill
{
 position: absolute;
  border: 0.08em solid yellow;
  width: 0.84em;
  height: 0.84em;
  clip: rect(0em, 0.5em, 1em, 0em);
  border-radius: 50%;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}
.pie-fill,
.c100.s51 .bar:after,
.c100.s51 .fill,
.c100.s52 .bar:after,
.c100.s52 .fill,
.c100.s53 .bar:after,
.c100.s53 .fill,
.c100.s54 .bar:after,
.c100.s54 .fill,
.c100.s55 .bar:after,
.c100.s55 .fill,
.c100.s56 .bar:after,
.c100.s56 .fill,
.c100.s57 .bar:after,
.c100.s57 .fill,
.c100.s58 .bar:after,
.c100.s58 .fill,
.c100.s59 .bar:after,
.c100.s59 .fill,
.c100.s60 .bar:after,
.c100.s60 .fill,
.c100.s61 .bar:after,
.c100.s61 .fill,
.c100.s62 .bar:after,
.c100.s62 .fill,
.c100.s63 .bar:after,
.c100.s63 .fill,
.c100.s64 .bar:after,
.c100.s64 .fill,
.c100.s65 .bar:after,
.c100.s65 .fill,
.c100.s66 .bar:after,
.c100.s66 .fill,
.c100.s67 .bar:after,
.c100.s67 .fill,
.c100.s68 .bar:after,
.c100.s68 .fill,
.c100.s69 .bar:after,
.c100.s69 .fill,
.c100.s70 .bar:after,
.c100.s70 .fill,
.c100.s71 .bar:after,
.c100.s71 .fill,
.c100.s72 .bar:after,
.c100.s72 .fill,
.c100.s73 .bar:after,
.c100.s73 .fill,
.c100.s74 .bar:after,
.c100.s74 .fill,
.c100.s75 .bar:after,
.c100.s75 .fill,
.c100.s76 .bar:after,
.c100.s76 .fill,
.c100.s77 .bar:after,
.c100.s77 .fill,
.c100.s78 .bar:after,
.c100.s78 .fill,
.c100.s79 .bar:after,
.c100.s79 .fill,
.c100.s80 .bar:after,
.c100.s80 .fill,
.c100.s81 .bar:after,
.c100.s81 .fill,
.c100.s82 .bar:after,
.c100.s82 .fill,
.c100.s83 .bar:after,
.c100.s83 .fill,
.c100.s84 .bar:after,
.c100.s84 .fill,
.c100.s85 .bar:after,
.c100.s85 .fill,
.c100.s86 .bar:after,
.c100.s86 .fill,
.c100.s87 .bar:after,
.c100.s87 .fill,
.c100.s88 .bar:after,
.c100.s88 .fill,
.c100.s89 .bar:after,
.c100.s89 .fill,
.c100.s90 .bar:after,
.c100.s90 .fill,
.c100.s91 .bar:after,
.c100.s91 .fill,
.c100.s92 .bar:after,
.c100.s92 .fill,
.c100.s93 .bar:after,
.c100.s93 .fill,
.c100.s94 .bar:after,
.c100.s94 .fill,
.c100.s95 .bar:after,
.c100.s95 .fill,
.c100.s96 .bar:after,
.c100.s96 .fill,
.c100.s97 .bar:after,
.c100.s97 .fill,
.c100.s98 .bar:after,
.c100.s98 .fill,
.c100.s99 .bar:after,
.c100.s99 .fill
{
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
/*-------------------------------------*	HINT.css - A CSS tooltip library
\*-------------------------------------*/
/**
 * HINT.css is a tooltip library made in pure CSS.
 *
 * Source: https://github.com/chinchang/hint.css
 * Demo: http://kushagragour.in/lab/hint/
 *
 * Release under The MIT License
 *
 */
/**
 * source: hint-core.scss
 *
 * Defines the basic styling for the tooltip.
 * Each tooltip is made of 2 parts:
 * 	1) body (:after)
 * 	2) arrow (:before)
 *
 * Classes added:
 * 	1) hint
 */
.hint,[data-hint] {
	position: relative;
	display: inline-block;
	/**
	 * tooltip arrow
	 */
/**
	 * tooltip body
	 */
}

.hint:before,.hint:after,[data-hint]:before,[data-hint]:after {
	position: absolute;
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	visibility: hidden;
	opacity: 0;
	z-index: 1000000;
	pointer-events: none;
	-webkit-transition: 0.3s ease;
	-moz-transition: 0.3s ease;
	transition: 0.3s ease;
	-webkit-transition-delay: 0ms;
	-moz-transition-delay: 0ms;
	transition-delay: 0ms;
}

.hint:hover:before,.hint:hover:after,.hint:focus:before,.hint:focus:after,[data-hint]:hover:before,[data-hint]:hover:after,[data-hint]:focus:before,[data-hint]:focus:after
	{
	visibility: visible;
	opacity: 1;
}

.hint:hover:before,.hint:hover:after,[data-hint]:hover:before,[data-hint]:hover:after
	{
	-webkit-transition-delay: 100ms;
	-moz-transition-delay: 100ms;
	transition-delay: 100ms;
}

.hint:before,[data-hint]:before {
	content: '';
	position: absolute;
	background: transparent;
	border: 6px solid transparent;
	z-index: 1000001;
}

.hint:after,[data-hint]:after {
	content: attr(data-hint);
	background: #383838;
	color: white;
	padding: 8px 10px;
	font-size: 12px;
	line-height: 12px;
	white-space: nowrap;
}

/**
 * source: hint-position.scss
 *
 * Defines the positoning logic for the tooltips.
 *
 * Classes added:
 * 	1) hint--top
 * 	2) hint--bottom
 * 	3) hint--left
 * 	4) hint--right
 */
/**
 * set default color for tooltip arrows
 */
.hint--top:before {
	border-top-color: #383838;
}

.hint--bottom:before {
	border-bottom-color: #383838;
}

.hint--left:before {
	border-left-color: #383838;
}

.hint--right:before {
	border-right-color: #383838;
}

/**
 * top tooltip
 */
.hint--top:before {
	margin-bottom: -12px;
}

.hint--top:after {
	margin-left: -18px;
}

.hint--top:before,.hint--top:after {
	bottom: 100%;
	left: 50%;
}

.hint--top:hover:after,.hint--top:hover:before,.hint--top:focus:after,.hint--top:focus:before
	{
	-webkit-transform: translateY(-8px);
	-moz-transform: translateY(-8px);
	transform: translateY(-8px);
}

/**
 * bottom tooltip
 */
.hint--bottom:before {
	margin-top: -12px;
}

.hint--bottom:after {
	margin-left: -18px;
}

.hint--bottom:before,.hint--bottom:after {
	top: 100%;
	left: 50%;
}

.hint--bottom:hover:after,.hint--bottom:hover:before,.hint--bottom:focus:after,.hint--bottom:focus:before
	{
	-webkit-transform: translateY(8px);
	-moz-transform: translateY(8px);
	transform: translateY(8px);
}

/**
 * right tooltip
 */
.hint--right:before {
	margin-left: -12px;
	margin-bottom: -6px;
}

.hint--right:after {
	margin-bottom: -14px;
}

.hint--right:before,.hint--right:after {
	left: 100%;
	bottom: 50%;
}

.hint--right:hover:after,.hint--right:hover:before,.hint--right:focus:after,.hint--right:focus:before
	{
	-webkit-transform: translateX(8px);
	-moz-transform: translateX(8px);
	transform: translateX(8px);
}

/**
 * left tooltip
 */
.hint--left:before {
	margin-right: -12px;
	margin-bottom: -6px;
}

.hint--left:after {
	margin-bottom: -14px;
}

.hint--left:before,.hint--left:after {
	right: 100%;
	bottom: 50%;
}

.hint--left:hover:after,.hint--left:hover:before,.hint--left:focus:after,.hint--left:focus:before
	{
	-webkit-transform: translateX(-8px);
	-moz-transform: translateX(-8px);
	transform: translateX(-8px);
}

/**
 * source: hint-theme.scss
 *
 * Defines basic theme for tooltips.
 *
 */
.hint:after,[data-hint]:after {
	text-shadow: 0 -1px 0px black;
	box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.3);
}

/**
 * source: hint-color-types.scss
 *
 * Contains tooltips of various types based on color differences.
 *
 * Classes added:
 * 	1) hint--error
 * 	2) hint--warning
 * 	3) hint--info
 * 	4) hint--success
 *
 */
/**
 * Error
 */
.hint--error:after {
	background-color: #b34e4d;
	text-shadow: 0 -1px 0px #592726;
}

.hint--error.hint--top:before {
	border-top-color: #b34e4d;
}

.hint--error.hint--bottom:before {
	border-bottom-color: #b34e4d;
}

.hint--error.hint--left:before {
	border-left-color: #b34e4d;
}

.hint--error.hint--right:before {
	border-right-color: #b34e4d;
}

/**
 * Warning
 */
.hint--warning:after {
	background-color: #c09854;
	text-shadow: 0 -1px 0px #6c5328;
}

.hint--warning.hint--top:before {
	border-top-color: #c09854;
}

.hint--warning.hint--bottom:before {
	border-bottom-color: #c09854;
}

.hint--warning.hint--left:before {
	border-left-color: #c09854;
}

.hint--warning.hint--right:before {
	border-right-color: #c09854;
}

/**
 * Info
 */
.hint--info:after {
	background-color: #3986ac;
	text-shadow: 0 -1px 0px #193b4d;
}

.hint--info.hint--top:before {
	border-top-color: #3986ac;
}

.hint--info.hint--bottom:before {
	border-bottom-color: #3986ac;
}

.hint--info.hint--left:before {
	border-left-color: #3986ac;
}

.hint--info.hint--right:before {
	border-right-color: #3986ac;
}

/**
 * Success
 */
.hint--success:after {
	background-color: #458746;
	text-shadow: 0 -1px 0px #1a321a;
}

.hint--success.hint--top:before {
	border-top-color: #458746;
}

.hint--success.hint--bottom:before {
	border-bottom-color: #458746;
}

.hint--success.hint--left:before {
	border-left-color: #458746;
}

.hint--success.hint--right:before {
	border-right-color: #458746;
}

/**
 * source: hint-always.scss
 *
 * Defines a persisted tooltip which shows always.
 *
 * Classes added:
 * 	1) hint--always
 *
 */
.hint--always:after,.hint--always:before {
	opacity: 1;
	visibility: visible;
}

.hint--always.hint--top:after,.hint--always.hint--top:before {
	-webkit-transform: translateY(-8px);
	-moz-transform: translateY(-8px);
	transform: translateY(-8px);
}

.hint--always.hint--bottom:after,.hint--always.hint--bottom:before {
	-webkit-transform: translateY(8px);
	-moz-transform: translateY(8px);
	transform: translateY(8px);
}

.hint--always.hint--left:after,.hint--always.hint--left:before {
	-webkit-transform: translateX(-8px);
	-moz-transform: translateX(-8px);
	transform: translateX(-8px);
}

.hint--always.hint--right:after,.hint--always.hint--right:before {
	-webkit-transform: translateX(8px);
	-moz-transform: translateX(8px);
	transform: translateX(8px);
}

/**
 * source: hint-rounded.scss
 *
 * Defines rounded corner tooltips.
 *
 * Classes added:
 * 	1) hint--rounded
 *
 */
.hint--rounded:after {
	border-radius: 4px;
}

/**
 * source: hint-effects.scss
 *
 * Defines various transition effects for the tooltips.
 *
 * Classes added:
 * 	1) hint--no-animate
 * 	2) hint--bounce
 *
 */
.hint--no-animate:before,.hint--no-animate:after {
	-webkit-transition-duration: 0ms;
	-moz-transition-duration: 0ms;
	transition-duration: 0ms;
}

.hint--bounce:before,.hint--bounce:after {
	-webkit-transition: opacity 0.3s ease, visibility 0.3s ease,
		-webkit-transform 0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
	-moz-transition: opacity 0.3s ease, visibility 0.3s ease, -moz-transform
		0.3s cubic-bezier(0.71, 1.7, 0.77, 1.24);
	transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s
		cubic-bezier(0.71, 1.7, 0.77, 1.24);
}

/**
 * based on hint.css with html content support
 */
.hint--html.hint:after {
	display: none;
	opacity: 0;
}

.hint__content { /* background: #383838; */
	/* background: rgb(243, 255, 255); */
	background: rgb(247, 197, 143);
	color: white;
	padding: 8px 10px;
	font-size: 12px;
	font-family: 'MuseoLight', sans-serif;
	line-height: 15px;
}

.hint .hint__content,[data-hint] .hint__content {
	position: absolute;
	-webkit-transform: translate3d(0, 0, 0);
	-moz-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	visibility: hidden;
	opacity: 0;
	z-index: 1000000;
	-webkit-transition: 0.3s ease;
	-moz-transition: 0.3s ease;
	transition: 0.3s ease;
	-webkit-transition-delay: 0ms;
	-moz-transition-delay: 0ms;
	transition-delay: 0ms;
}

.hint:hover .hint__content,.hint:focus .hint__content,[data-hint]:hover .hint__content,[data-hint]:focus .hint__content
	{
	visibility: visible;
	opacity: 1;
}

.hint:hover .hint__content,[data-hint]:hover .hint__content {
	-webkit-transition-delay: 100ms;
	-moz-transition-delay: 100ms;
	transition-delay: 100ms;
}

.hint.hint--notrans:before,.hint.hint--notrans:after,[data-hint].hint--notrans:before,[data-hint].hint--notrans:after
	{
	-webkit-transition: none;
	-moz-transition: none;
	transition: none;
}

.hint.hint--notrans .hint__content,[data-hint].hint--notrans .hint__content
	{
	-webkit-transition: none;
	-moz-transition: none;
	transition: none;
}

/**
 * top tooltip
 */
.hint--top:before,.hint--top:after {
	left: calc(50% -   6px);
}

.hint--top .hint__content {
	margin-left: -18px;
}

.hint--top .hint__content {
	bottom: 100%;
	left: 50%;
	left: calc(50% -   6px);
}

.hint--top .hint__content:after {
	content: ' ';
	position: absolute;
	top: 100%;
	left: 0;
	height: 12px;
	width: 100%;
	opacity: 0;
	background-color: red;
}

.hint--top:hover .hint__content,.hint--top:focus .hint__content {
	-webkit-transform: translateY(-8px);
	-moz-transform: translateY(-8px);
	transform: translateY(-8px);
}

/**
 * bottom tooltip
 */
.hint--bottom:before,.hint--bottom:after {
	left: calc(50% -   6px);
}

.hint--bottom .hint__content {
	margin-left: -18px;
}

.hint--bottom .hint__content {
	top: 100%;
	left: calc(50% -   6px);
}

.hint--bottom .hint__content:after {
	content: ' ';
	position: absolute;
	top: -12px;
	left: 0;
	height: 12px;
	width: 100%;
	opacity: 0;
	background-color: red;
}

.hint--bottom:hover .hint__content,.hint--bottom:focus .hint__content {
	-webkit-transform: translateY(8px);
	-moz-transform: translateY(8px);
	transform: translateY(8px);
}

/**
 * right tooltip
 */
.hint--right .hint__content {
	margin-bottom: -14px;
}

.hint--right .hint__content {
	left: 100%;
	bottom: 50%;
}

.hint--right .hint__content:after {
	content: ' ';
	position: absolute;
	left: -12px;
	top: 0;
	height: 100%;
	width: 12px;
	opacity: 0;
	background-color: red;
}

.hint--right:hover .hint__content,.hint--right:focus .hint__content {
	-webkit-transform: translateX(8px);
	-moz-transform: translateX(8px);
	transform: translateX(8px);
}

/**
 * left tooltip
 */
.hint--left .hint__content {
	margin-bottom: -14px;
}

.hint--left .hint__content {
	right: 100%;
	bottom: 50%;
}

.hint--left .hint__content:after {
	content: ' ';
	position: absolute;
	left: 100%;
	top: 0;
	height: 100%;
	width: 12px;
	opacity: 0;
	background-color: red;
}

.hint--left:hover .hint__content,.hint--left:focus .hint__content {
	-webkit-transform: translateX(-8px);
	-moz-transform: translateX(-8px);
	transform: translateX(-8px);
}

/**
 * Error
 */
.hint--error .hint__content {
	background-color: #b34e4d;
}

.hint--error.hint--top:before {
	border-top-color: #b34e4d;
}

.hint--error.hint--bottom:before {
	border-bottom-color: #b34e4d;
}

.hint--error.hint--left:before {
	border-left-color: #b34e4d;
}

.hint--error.hint--right:before {
	border-right-color: #b34e4d;
}

/**
 * Warning
 */
.hint--warning .hint__content {
	background-color: #c09854;
}

.hint--warning.hint--top:before {
	border-top-color: #c09854;
}

.hint--warning.hint--bottom:before {
	border-bottom-color: #c09854;
}

.hint--warning.hint--left:before {
	border-left-color: #c09854;
}

.hint--warning.hint--right:before {
	border-right-color: #c09854;
}

/**
 * Info
 */
.hint--info .hint__content {
	background-color: #3986ac;
}

.hint--info.hint--top:before {
	border-top-color: #3986ac;
}

.hint--info.hint--bottom:before {
	border-bottom-color: #3986ac;
}

.hint--info.hint--left:before {
	border-left-color: #3986ac;
}

.hint--info.hint--right:before {
	border-right-color: #3986ac;
}

/**
 * Success
 */
.hint--success .hint__content {
	background-color: #458746;
}

.hint--success.hint--top:before {
	border-top-color: #458746;
}

.hint--success.hint--bottom:before {
	border-bottom-color: #458746;
}

.hint--success.hint--left:before {
	border-left-color: #458746;
}

.hint--success.hint--right:before {
	border-right-color: #458746;
}

.hint.hint--hidden:hover:after,.hint.hint--hidden:hover:before {
	opacity: 1;
	visibility: hidden;
}

.hint.hint--hidden:hover .hint__content {
	opacity: 0;
	visibility: hidden;
}

.hint--always .hint__content {
	opacity: 1;
	visibility: visible;
}

.hint--always.hint--top .hint__content {
	-webkit-transform: translateY(-8px);
	-moz-transform: translateY(-8px);
	transform: translateY(-8px);
}

.hint--always.hint--bottom .hint__content {
	-webkit-transform: translateY(8px);
	-moz-transform: translateY(8px);
	transform: translateY(8px);
}

.hint--always.hint--left .hint__content {
	-webkit-transform: translateX(-8px);
	-moz-transform: translateX(-8px);
	transform: translateX(-8px);
}

.hint--always.hint--right .hint__content {
	-webkit-transform: translateX(8px);
	-moz-transform: translateX(8px);
	transform: translateX(8px);
}

.cardDataDiv {
	width: 230px;
	margin: 5px;

}

.spandiv
{
	text-align:center;
	font-size: 20px;
}

/*Add New Css By Dhanendra on 28-07-15 */
.cardViewTable
{
	color: gray;
}
/*Add By Swati on Date 16-05-16*/
.cardViewTableVer
{
	padding-top:0px;
	color: gray;
	font-size:16px;
}
.cardViewTableHor
{
	padding-top:10px;
	padding-bottom:10px;
	color: gray;
	padding-right:265px;
	margin-left:2px

}
/*End By Swati on Date 16-05-16*/
.topAlign
{
	vertical-align: top;
}
.marginTop
{
	margin-top: 5px;
}
/* .internalSpan
{
	color: #000 !important;
	font-size: 25px !important;
	left: -12px !important;
	top: 25px !important;
}
 */
/*Changed by sainath T. on 09-OCT-2019-Start*/
.internalSpan
{
  color: #000!important;
  font-size: 10px!important;
  left: 2px!important;
  top: -3px!important;
}

.internalSpanForExport
{
  color: #000 !important;
	font-size: 10px !important;
	left: 2px !important;
  top: 16px !important;
}
/*Changed by sainath T. on 09-OCT-2019-End*/

/* Suraj */

.internalSpan-red{
	left: 2px !important;
	top: 2px !important;
	background-color: red;
	border-radius: 50%;
	height: 90%;
	width: 90% !important;
	color: transparent !important;
}

.internalSpan-yellow{
	left: 2px !important;
	top: 2px !important;
	background-color: yellow;
	border-radius: 50%;
	height: 90%;
	width: 90% !important;
	color: transparent !important;
}

.internalSpan-green{
	left: 2px !important;
	top: 2px !important;
	background-color: green;
	border-radius: 50%;
	height: 90%;
	width: 90% !important;
	color: transparent !important;
}

.circleNotDisplay {
  position: relative;
  font-size: 92px;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  margin: 0 auto;
}
.circleNotDisplay > span {
  position: absolute;
  width: 100%;
  z-index: 1;
  /* left: 0;
  top: 0; */
  left: 14px;
  top: 22px;
  width: 5em;
  /* line-height: 5em; */
  /* font-size: 0.2em; */
  font-size:13px;
  color: #cccccc;
  display: block;
  text-align: center;
  white-space: nowrap;
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  transition-duration: 0.2s;
  -webkit-transition-timing-function: ease-out;
  -moz-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
/*End New Css By Dhanendra on 28-07-15 */

/*Start New Css for Animation circle view By Nikhil on 17-05-16 */

/* Load animation */

@-webkit-keyframes
load { 0% {
stroke-dashoffset:0
}
}
@-moz-keyframes
load { 0% {
stroke-dashoffset:0
}
}
@keyframes
load { 0% {
stroke-dashoffset:0
}
}

/* Container */

.progress {
  position: relative;
  display: inline-block;
  padding: 0;
  text-align: center;
  padding-left:1px;
}

/* Item */

.progress>li {
  display: inline-block;
  position: relative;
  text-align: center;
  color: black;
  font-family: Lato;
  font-weight: 100;
  /* Remove margin for circular card view for serdia on dated 18-05-16 */
  /* margin: 2rem; */
}

.progress>li:before {
  content: attr(data-name);
  position: absolute;
  width: 100%;
  bottom: -2rem;
  font-weight: 400;
}

.progress>li:after {
  content: attr(data-percent);
  position: absolute;
  width: 100%;
  top: 3.7rem;
  left: 0;
  font-size: 2rem;
  text-align: center;
}

.progress svg {
  width: 10rem;
  height: 10rem;
}

.progress svg:nth-child(2) {
  position: absolute;
  left: 0;
  top: 0;
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
}

.progress svg:nth-child(2) path {
  fill: none;
  stroke-width: 25;
  stroke-dasharray: 629;
  stroke: rgba(255, 255, 255, 0.9);
  -webkit-animation: load 2s;
  -moz-animation: load 2s;
  -o-animation: load 2s;
  animation: load 2s;
}

/*End New Css for Animation circle view By Nikhil on 17-05-16 */

/*Start Animation Circle Css Small Size By Nikhil On Date 06-06-2016*/

.animationSmallCircle {
  position: relative;
  display: inline-block;
  padding: 0;
  text-align: center;
  padding-left:1px;
  margin-top:0;
}

.animationSmallCircle>li {
  display: inline-block;
  position: relative;
  text-align: center;
  color: black;
  font-family: Lato;
  font-weight: 100;
}

.animationSmallCircle>li:before {
  content: attr(data-name);
  position: absolute;
  width: 100%;
  bottom: -11px;
  font-weight: 400;
}

.animationSmallCircle>li:after {
  content: attr(data-percent);
  position: absolute;
  width: 100%;
  top: 2.9rem;
  left: 0;
  font-size: 2rem;
  text-align: center;
}

.animationSmallCircle svg {
  width: 7rem;
  height: 8rem;
}

.animationSmallCircle svg:nth-child(2) {
  position: absolute;
  left: 0;
  top: 0;
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
}

.animationSmallCircle svg:nth-child(2) path {
  fill: none;
  stroke-width: 25;
  stroke-dasharray: 629;
  stroke: rgba(255, 255, 255, 0.9);
  -webkit-animation: load 2s;
  -moz-animation: load 2s;
  -o-animation: load 2s;
  animation: load 2s;
}
/*End Animation Circle Css Small Size By Nikhil On Date 06-06-2016*/
/*circle progress css-end */

/* By Sainath T. on 30-Aug-2019 - Start */
::ng-deep .cdk-overlay-container {
  z-index: 2 !important;
}
/* By Sainath T. on 30-Aug-2019 - End */

/* Added by Vikas lagad on 03-Oct-2019 Start*/
.dashboardCss{
    background-color: #ffff;
    position: fixed;
    font-size: 15px;
    color: #727273;
}

.noUploadStatus
{
  color: #727272;
  margin: 0px 0px 0px 13px;
  top: 8px;
  position: absolute;
}

/* Added by Vikas lagad on 03-Oct-2019 End*/
