Added New Css for serdia circular card view.

git-svn-id: http://15.206.35.175/svn/proteus/business-java/trunk@101673 ce508802-f39f-4f6c-b175-0d175dae99d5

webitm-dashboard/GWT-Component/war/circle.css

@@ -717,7 +717,7 @@
 }
 .c100.p55 .bar {
   -webkit-transform: rotate(198deg);
-  -moz-transform: rotate(198deg);
+  -moz-transform: rotate(198deg);.cardViewTableVer
   -ms-transform: rotate(198deg);
   -o-transform: rotate(198deg);
   transform: rotate(198deg);
@@ -1850,9 +1850,21 @@
 }
 
 /*Add New Css By Dhanendra on 28-07-15 */
-.cardViewTable
+.cardViewTableVer
 {
+	padding-top:0px;
+	/* padding-bottom:10px; */
 	color: gray;
+	font-size:16px;
+}
+.cardViewTableHor
+{
+	padding-top:10px;
+	padding-bottom:10px;
+	color: gray;
+	padding-right:265px;
+	margin-left:2px
+	
 }
 .topAlign
 {
@@ -1926,8 +1938,97 @@
 }
 /*End New Css By Dhanendra on 28-07-15 */
 
+/*Start New Css for serdia card 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;
+  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;
+}
+#temp1
+{
 
+}
 
+/*End New Css for serdia card view  By Nikhil on 17-05-16 */