@font-face{font-family: 'Noto Sans Malayalam';font-weight:normal;font-style:normal;font-display:auto;src:local('Noto Sans Malayalam'), url('//css.mathrubhumi.com/font/NotoSansMalayalam-Regular.woff2') format('woff2'),url('//css.mathrubhumi.com/font/NotoSansMalayalam-Regular.woff') format('woff')}

 /* @font-face{font-family: 'Roboto', sans-serif;font-weight:normal;font-style:normal;font-display:swap;src: local('Roboto'), url('//css.mathrubhumi.com/font/Roboto-Regular.ttf') format('ttf')} */
 
a,body{color: #222;text-decoration:none;background:transparent;font-family: 'Roboto', sans-serif;cursor:pointer}
*, ::after, ::before { box-sizing: border-box;margin: 0; padding: 0;}

.common_text {
  font-family: Noto Sans Malayalam,Arial,Sans-Serif !important;
  font-style: normal;
  font-variant: normal;
  text-transform: none;
  text-align: left;
  font-weight: 400;
}
.election-flip{
    position: fixed;
    bottom:50px;
    right:50px;
    background:url(../images/bg-widget.png);
    width: 93px;
    height: 127px;
    animation-duration: 4s;
    padding:15px;
    color:#fff;
    font-size: 24px;
    -webkit-backface-visibility: hidden!important;
    -moz-backface-visibility: hidden!important;
    -o-backface-visibility: hidden!important;
    backface-visibility: hidden!important;
}
@keyframes flip {
	0% {
		-webkit-transform: perspective(800px) scaleX(1) translateZ(0) rotateY(-1turn);
		transform: perspective(800px) scaleX(1) translateZ(0) rotateY(-1turn);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out
	}
	10% {
		-webkit-transform: perspective(800px) scaleX(1) translateZ(150px) rotateY(-190deg);
		transform: perspective(800px) scaleX(1) translateZ(150px) rotateY(-190deg);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out
	}
	12% {
		-webkit-transform: perspective(800px) scaleX(1) translateZ(150px) rotateY(-170deg);
		transform: perspective(800px) scaleX(1) translateZ(150px) rotateY(-170deg);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in
	}
	20% {
		-webkit-transform: perspective(800px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg);
		transform: perspective(800px) scale3d(.95, .95, .95) translateZ(0) rotateY(0deg);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in
	}
	to {
		-webkit-transform: perspective(800px) scaleX(1) translateZ(0) rotateY(0deg);
		transform: perspective(800px) scaleX(1) translateZ(0) rotateY(0deg);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in
	}
}

.wrapper:hover .election-flip
{
    -webkit-animation-play-state: paused;
    -moz-animation-play-state: paused;
    -o-animation-play-state: paused;
     animation-play-state: paused;
}

/* ---- cube---- */

.scene--cube {
    width: 100px;
    height: 100px;
    margin: 80px 0;
    perspective: 500px;
  }
  
  .scene--persp-cube {
    perspective: 400px;
  }
  
  .cube {
    width: 100px;
    height: 100px;
    position: relative;
    transform-style: preserve-3d;
    transform: translateZ(-100px);
	margin:35px;
}
  
  .scene--hero {
    height: 100px;
    margin: 80px 0;
    perspective: 500px;
    border: none;
  }
  
  .cube--hero {
    margin: 0 auto;
  }
  
  .cube.is-spinning {
    animation: spinCube 8s infinite ease-in-out;
  }
  
  @keyframes spinCube {
      0% { transform: translateZ(-100px) rotateX(  0deg) rotateY(  0deg); }
    100% { transform: translateZ(-100px) rotateX(360deg) rotateY(360deg); }
  }
  
  .cube__face {
    position: absolute;
    width: 100px;
    height: 100px;
    font-weight: bold;
    color: #001647;
    text-align: center;
    background: url(../images/bg-cube-flip.png);
    overflow: hidden;
}
  
  .cube.is-backface-hidden .cube__face {
    backface-visibility: hidden;
  }
  
  .cube__face--front  { background:url(../images/bg-cube-new-flip.jpg); }
  .cube__face--right  { background:url(../images/bg-cube-new.png); }
  .cube__face--back   { background:url(../images/bg-cube-new-flip.jpg); }
  .cube__face--left   { background:url(../images/bg-cube-new.png); }
  .cube__face--top    { background:url(../images/bg-cube-new.png); }
  .cube__face--bottom { background:url(../images/bg-cube-new-flip.jpg); }
  
  .cube__face--front  { transform: rotateY(  0deg) translateZ(50px); }
  .cube__face--right  { transform: rotateY( 90deg) translateZ(50px); }
  .cube__face--back   { transform: rotateY(180deg) translateZ(50px); }
  .cube__face--left   { transform: rotateY(-90deg) translateZ(50px); }
  .cube__face--top    { transform: rotateX( 90deg) translateZ(50px); }
  .cube__face--bottom { transform: rotateX(-90deg) translateZ(50px); }
  
  .cube.show-front  { transform: translateZ(-50px) rotateY(   0deg); }
  .cube.show-right  { transform: translateZ(-50px) rotateY( -90deg); }
  .cube.show-back   { transform: translateZ(-50px) rotateY(-180deg); }
  .cube.show-left   { transform: translateZ(-50px) rotateY(  90deg); }
  .cube.show-top    { transform: translateZ(-50px) rotateX( -90deg); }
  .cube.show-bottom { transform: translateZ(-50px) rotateX(  90deg); }
  
  /* cube--step0 */
  
  .cube--step0 {
    position: relative;
    width: auto;
    height: auto;
    transform: none;
  }
  
  .cube--step0 .cube__face {
    display: inline-block;
    position: static;
    margin: 0 10px 10px 0;
    transform: none;
  }
  
  /* cube--step1 */
  
  .cube--step1 {
    transform: none;
  }
  
  .cube--step1 .cube__face {
    transform: none;
  }
  
  /* cube--step2 */
  
  .cube--step2 {
    transform: none;
  }
  
  .cube--step2 .cube__face--front  { transform: rotateY(  0deg); }
  .cube--step2 .cube__face--right  { transform: rotateY( 90deg); }
  .cube--step2 .cube__face--back   { transform: rotateY(180deg); }
  .cube--step2 .cube__face--left   { transform: rotateY(-90deg); }
  .cube--step2 .cube__face--top    { transform: rotateX( 90deg); }
  .cube--step2 .cube__face--bottom { transform: rotateX(-90deg); }
  
  /* cube--step3 */
  
  .cube--step3 {
    transform: none;
  }
  
  /* cube--rotate */
  
  .cube--rotate { transition: transform 1s; }

  h5 {
    color: #f1f1f1;
    padding: 3px 10px 0px 10px;
    font-size: 11px;
    font-weight: normal;
}
.rslt {
  color: #333;
  display: flex;
  flex-direction: column;
  margin-top: 2px;
  position: relative;
  height: 82px;
}
.rslt .item {
    background: #f1f1f1;
    margin: 1px auto 1px auto;
    border-radius: 4px;
    border: 1px solid #d6d2d2;
    font-size: 11px;
    padding: 0px 0px 0px 7px;
    box-shadow: 1px 1px 3px #908c8c;
    width: 64px;
    display: flex;
    justify-content: space-between;
}
.rslt span.front {
    border-radius: 4px;
    display: inline-block;
    color: #fff;
    padding: 0px 5px;
    font-size: 13px;
    margin-left: 5px;
    font-weight: normal;
}
.candidpic {
  width: 60px;
  height: 60px;
  border-radius: 70px;
  overflow: hidden;
  margin: 0 auto;
}
.candidpic img{
  width:100%;
}
.up,.down{ 
  position: absolute;
  bottom: 10px;
  left: 7px;
}
.item.sts {
  justify-content: space-around;
  padding-left: 0;
}