@import "reset.css";
html{
  background: #060107 !important;
  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */
  user-select: none;          /* Likely future */ 
  overflow: hidden;
}
body{
    -webkit-user-select: none;  /* Chrome all / Safari all */
    -moz-user-select: none;     /* Firefox all */
    -ms-user-select: none;      /* IE 10+ */
    user-select: none;          /* Likely future */   
    cursor: default;
}
a {
  cursor: pointer;
}
button {
  cursor: pointer;
}
.videoPage{
  display:none;
}
.loaderPage{
  background: url("./assets/common/loading.gif") no-repeat center;
  position: fixed;
  background-size: 80px 80px;
  background-color: rgb(0,0,0); 
  width: 100%; height: 100%; z-index: 3; left:0px; 
  display: none;
}
.embedVideoDiv {
  cursor: default;
}
.selectedText {
  color: #b80067;
}
.zee5logo {
  position: fixed;
  bottom: calc(100%*70/546);
  /*bottom: calc(100%*65.5/546);*/
  right: 10px;
  width: calc(100%*75/970);
  display: none;
}
.zee5logo:hover {
  cursor: pointer;
  /*background:@iconHoverColor;*/
  /*border-radius: 50%; */
  z-index: 1;
}
.occupyAvailableSpace {
  width: 100%;
  height: 100%;
}
#embedVideoDiv .captionator-cue-canvas {
  font-size: 14px;
}
.container {
  width: calc(100%);
  height: calc(100%);
  position: absolute;
}
.container .newReplay {
  /*background-color: red;*/
  height: calc(100%*80/546);
  width: calc(100%*80/970);
  /*width:calc(100%*160/970);*/
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.container .newReplay .watched {
  /*background-color: green;*/
  /*width:calc(100%*80/160);*/
  width: calc(100%);
  height: calc(100%);
  display: inline-flex;
}
.container .newReplay .watched:hover {
  cursor: pointer;
  background: rgba(255, 255, 255, 0.2);
}
.container .newReplay .watched .starting {
  /*width: calc(100%*50/80);*/
  width: calc(100%);
  position: relative;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.container .playerOverlay {
  position: absolute;
  top: 0px;
  left: 0px;
  width: calc(100%);
  height: calc(100%);
}
.container .playerOverlay .loader {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.container .playerOverlay .loader.buffer {
  width: calc(100%*60/970);
}
.container .playerOverlay .loader.replay {
  /*width:calc(100%*120/970);*/
  width: calc(100%*60/970);
  z-index: 1;
}
.container .playerOverlay .loader.replay:hover {
  cursor: pointer;
  background: rgba(255, 255, 255, 0.2);
}
.container .playerOverlay .loader.play {
  width: calc(100%*120/970);
  /*width:calc(100%*60/970);*/
  z-index: 1;
}
.container .playerOverlay .loader.play:hover {
  cursor: pointer;
  background: rgba(255, 255, 255, 0.2);
}
.container .playerOverlay .loader.error {
  width: calc(100%);
  height: calc(20%);
  color: white;
  text-align: center;
  font-family: 'Noto Sans';
  font-weight: 400;
}
.container .playerOverlay .ccPlayerText {
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: center;
  /*background: pink;*/
  height: 10%;
  /*font-size: 14px;*/
  font-family: 'Noto Sans';
  font-weight: 400;
  visibility: visible;
}
.container .playerOverlay .playerHeaderBar {
  width: calc(100%);
  height: calc(100%*77/546);
  /*background:blue;*/
  position: relative;
}
.container .playerOverlay .playerHeaderBar .playerTitle {
  /*
					809px
					-21 px (from right controls)
					-21 px (from left offset)
					=788
				*/
  width: calc(100%*788/970);
  height: calc(100%);
  position: absolute;
  /*=====================================================*/
}
.container .playerOverlay .playerHeaderBar .playerTitle .titleText {
  /*
						788px
						-21px
						=767
					*/
  /*background: crimson;*/
  width: calc(100%*767/788);
  height: calc(100%*22/77);
  /*height: calc(100%*18/77);*/
  /*margin-top: calc(100%*31/788);*/
  /*.margin-top(31,788,77);*/
  top: calc(100%*27/77);
  /*top:calc(100%*31/77);*/
  position: absolute;
  margin-left: calc(100%*21/788);
  /*									font-size: calc(18px);*/
  /*overflow: hidden;	*/
  /*commented for a fix for clipping of text needs to be removed*/
  /*transition: visibility 300ms;*/
}
.container .playerOverlay .playerHeaderBar .playerTitle .titleText p {
  color: #ffffff;
  font-family: 'Noto Sans';
  font-weight: 400;
  /*overflow: hidden;	*/
  /*commented for a fix for clipping of text needs to be removed*/
  width: 100%;
  height: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  letter-spacing: 0.01em;
  /*						font-size: 1rem;
*/
}
.container .playerOverlay .playerHeaderBar .playerHeaderRightControlsCastDisabled {
  /*
					115px
				*/
  /*background: pink;*/
  position: absolute;
  width: calc(100%*49/970);
  height: calc(100%);
  display: inline-flex;
  right: 0;
  /*left: calc(100%*788/970);*/
  /*@blockWidth:182;
				@blockHeight:77;
				.controlIcon(@blockWidth,@blockHeight);*/
}
.container .playerOverlay .playerHeaderBar .playerHeaderRightControlsCastDisabled .controlIcon {
  /*background: red;*/
  display: inline-flex;
  width: calc(100%*44/49);
  height: calc(100%*44/77);
  /*margin-right: calc(100%*1/182);*/
  /*margin-top: calc(100%*11/182);//11px*/
  /*.margin-top(11,182,77);*/
  position: absolute;
  top: calc(100%*11/77);
}
.container .playerOverlay .playerHeaderBar .playerHeaderRightControlsCastDisabled .controlIcon:hover {
  cursor: pointer;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
}
.container .playerOverlay .playerHeaderBar .playerHeaderRightControlsCastDisabled .menuCtrl {
  /*background: cyan;*/
  position: absolute;
  /*left:calc(100%*70/115);//21+44+5*/
  margin-left: calc(100%*4/49);
}
.container .playerOverlay .playerHeaderBar .playerHeaderRightControlsCastDisabled .menuCtrl .shareIcon {
  width: 60%;
  top: 50%;
  left: 50%;
  position: relative;
  transform: translate(-50%, -50%);
}
.container .playerOverlay .playerHeaderBar .playerHeaderRightControlsCastEnabled {
  /*
					44*3
					+1
					+5
					+23
					+21 left offset
					=182px
				*/
  /*background: pink;*/
  width: calc(100%*116/970);
  height: calc(100%);
  /*display: inline-flex;*/
  position: absolute;
  right: 0;
  /*left: calc(100%*788/970);*/
  /*@blockWidth:182;
				@blockHeight:77;
				.controlIcon(@blockWidth,@blockHeight);*/
}
.container .playerOverlay .playerHeaderBar .playerHeaderRightControlsCastEnabled .controlIcon {
  /*background: red;*/
  /*display: inline-flex;*/
  width: calc(100%*44/116);
  height: calc(100%*44/77);
  margin-right: calc(100%*1/116);
  /*margin-top: calc(100%*11/182);//11px*/
  /*.margin-top(11,182,77);*/
  position: relative;
  top: calc(100%*11/77);
}
.container .playerOverlay .playerHeaderBar .playerHeaderRightControlsCastEnabled .controlIcon:hover {
  cursor: pointer;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
}
.container .playerOverlay .playerHeaderBar .playerHeaderRightControlsCastEnabled .castCtrl {
  /*background: red;*/
  position: absolute;
  /*left:calc(100%*66/182);//21+44+1*/
  margin-left: calc(100%*22/116);
  /*z-index: 9;*/
  /*for charmboard*/
}
.container .playerOverlay .playerHeaderBar .playerHeaderRightControlsCastEnabled .menuCtrl {
  /*background: cyan;*/
  position: absolute;
  /*visibility: hidden;*/
  left: calc(100%*67/116);
  margin-left: calc(100%*4/116);
}
.container .playerOverlay .playerHeaderBar .playerHeaderRightControlsCastEnabled .menuCtrl .shareIcon {
  width: 60%;
  top: 50%;
  left: 50%;
  position: relative;
  transform: translate(-50%, -50%);
}
.container .playerOverlay .playerHeaderBar .shareOptions {
  position: absolute;
  right: 0px;
  top: 100%;
  z-index: 1;
}
.container .playerOverlay .playerInfoSection {
  width: calc(100%);
  height: calc(100%*403.5/546);
  /*height:calc(100%*404/546);//546-(77+65.5)/546//0.5px fix for video overflow issue*/
  /*background:pink;*/
  position: relative;
}
.container .playerOverlay .playerInfoSection .infoTextSection {
  width: calc(100%);
  height: calc(100%);
  /*background: @infoSectionBackground;*/
  display: inline-flex;
  position: absolute;
  /*background: yellow;*/
  /*visibility: hidden;//needs to be uncommented*/
}
.container .playerOverlay .playerInfoSection .infoTextSection .infoText {
  color: #ffffff;
  width: calc(100%*932/970);
  height: calc(100%*395/403.5);
  /*background: pink;*/
  /*margin-top: calc(100%*4/970);//4px top*/
  /*.margin-top(4,970,403.5);*/
  position: relative;
  top: calc(100%*4/403.5);
  margin-left: calc(100%*21/970);
  /*font-size: 14px;*/
  /*line-height: calc(100%*24/14);*/
  line-height: 1.714em;
  letter-spacing: 0.01em;
  font-family: 'Noto Sans';
  font-weight: 400;
  overflow: hidden;
}
.container .playerOverlay .playerInfoSection .popUpsSection {
  /*background: green;*/
  width: calc(100%*331/970);
  height: calc(100%);
  display: inline-flex;
  position: absolute;
  /*background: green;*/
  right: 0;
  font-family: 'Noto Sans';
  font-weight: 400;
  /*z-index: 101;*/
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock {
  width: calc(100%*310/331);
  height: calc(100%*395/403.5);
  /*margin-top: calc(100%*4/331);//4px top*/
  /*.margin-top(4,331,403.5);*/
  position: relative;
  top: calc(100%*4/403.5);
  /*position: relative;*/
  /*background: cyan;*/
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .ccWindow {
  width: calc(100%*200/310);
  /*height: calc(100%*204/395);*/
  /*background: yellow;*/
  background: #1b0f1e;
  bottom: 0;
  position: absolute;
  /*visibility: hidden;*/
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .ccWindow .ccOption {
  width: 100%;
  /*height: calc(100%*40/204);*/
  /*background: black;*/
  background: #060107;
  /*margin-bottom: calc(100%*1/200);//(720-639=81) left*/
  border-bottom-style: solid;
  border-bottom-color: #1b0f1e;
  position: relative;
  font-size: 1em;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .ccWindow .ccOption:hover {
  cursor: pointer;
  background: #2a212c;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .ccWindow .ccOption .controlSection {
  position: absolute;
  width: calc(100%*37/200);
  height: calc(100%);
  /*background: aquamarine;*/
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .ccWindow .ccOption .controlSection .menuCtrlIcon {
  width: calc(100%*24/37);
  height: calc(100%*24/40);
  /*background: red;*/
  margin-left: calc(100%*4/37);
  /*.margin-top(8,37,40);*/
  position: relative;
  top: calc(100%*8/40);
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .ccWindow .ccOption .textSection {
  width: calc(100%*149/200);
  height: 100%;
  /*background: wheat;*/
  font-size: 1em;
  position: absolute;
  margin-left: calc(100%*37/200);
  color: #ffffff;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .ccWindow .ccOption .textSection .textBlock {
  /*background: red;*/
  font-size: 1em;
  width: calc(100%);
  height: calc(100%*14/40);
  /*.margin-top(13,149,40);*/
  position: relative;
  top: calc(100%*13/40);
  /*.qualityRes{
										font-size: 1em;
										float: left;
									}
									.qualityResValue{
										font-size: 1em;
										float: right;
									}*/
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .ccWindow .ccOption .textSection .subTitlesText {
  width: calc(100%*105/149);
  height: 100%;
  /*background: yellow;*/
  font-size: 1em;
  position: absolute;
  /*margin-left: calc(100%*37/200);*/
  color: #ffffff;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .ccWindow .ccOption .textSection .subTitlesText .textBlock {
  /*background: red;*/
  font-size: 1em;
  width: calc(100%);
  height: calc(100%*14/40);
  /*.margin-top(13,149,40);*/
  position: relative;
  top: calc(100%*13/40);
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .ccWindow .ccOption .textSection .toggleMenu {
  width: calc(100%*44/149);
  height: calc(100%*22/40);
  position: absolute;
  /*.margin-top(14,53,50);*/
  top: calc(100%*9/40);
  right: 0;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow {
  width: calc(100%*200/310);
  /*height: calc(100%*122/395);*/
  /*background: crimson;*/
  background: #1b0f1e;
  bottom: 0;
  position: absolute;
  /*visibility: hidden;*/
  margin-left: calc(100%*81/310);
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsControls {
  width: 100%;
  height: 100%;
  font-size: 1em;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsControls .settingsControlOption {
  /*	position: absolute;
								bottom: 0;
								width: 100%;
								height: calc(100%);
								.settingsOptionElement{
									width: 100%;
									height: calc(100%*40/122);
									background: yellow;
									margin-bottom: calc(100%*1/200);//(720-639=81) left

								}*/
  width: 100%;
  font-size: 1em;
  background: #060107;
  /*height: calc(100%*40/122);*/
  /*background: yellow;*/
  /*margin-bottom: calc(100%*1/200);//(720-639=81) left*/
  border-bottom-style: solid;
  border-bottom-color: #1b0f1e;
  position: relative;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsControls .settingsControlOption:hover {
  cursor: pointer;
  background: #2a212c;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsControls .settingsControlOption .textSection {
  width: calc(100%*129/200);
  height: 100%;
  /*background: wheat;*/
  font-size: 1em;
  position: absolute;
  margin-left: calc(100%*13/200);
  color: #ffffff;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsControls .settingsControlOption .textSection .textBlock {
  /*background: red;*/
  font-size: 1em;
  width: calc(100%);
  height: calc(100%*14/40);
  /*.margin-top(13,129,50);*/
  position: relative;
  /*top:calc(100%*13/50);*/
  top: calc(100%*18/50);
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsControls .settingsControlOption .controlSection {
  position: absolute;
  width: calc(100%*53/200);
  height: calc(100%);
  margin-left: calc(100%*142/200);
  /*background: aquamarine;*/
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsControls .settingsControlOption .controlSection .menuCtrlIcon {
  width: calc(100%*24/53);
  height: calc(100%*22/50);
  /*background: red;*/
  right: 0;
  position: absolute;
  /*.margin-top(13,53,50);*/
  top: calc(100%*13/50);
  /*margin-left: calc(100%*4/37);*/
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsControls .settingsControlOption .controlSection .toggleMenu {
  width: calc(100%*44/53);
  height: calc(100%*22/50);
  position: absolute;
  /*.margin-top(14,53,50);*/
  top: calc(100%*14/50);
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsListOptions {
  width: 100%;
  height: 100%;
  font-size: 1em;
  overflow-y: scroll;
  overflow-x: hidden;
  -ms-overflow-style: scrollbar;
  scrollbar-track-color: #333;
  scrollbar-base-width: 4px;
  scrollbar-base-color: #5f4e62;
  scrollbar-highlight-color: #333;
  scrollbar-arrow-color: #333;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsListOptions::-webkit-scrollbar {
  width: 3px;
  background-color: #333;
  opacity: 10%;
  cursor: pointer;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsListOptions::-webkit-scrollbar-thumb {
  background: #5f4e62;
  width: 4px;
  cursor: pointer;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsListOptions .settingsListOption {
  width: 100%;
  /*height: calc(100%*40/204);*/
  /*background: pink;*/
  background: #060107;
  /*margin-bottom: calc(100%*1/200);//(720-639=81) left*/
  border-bottom-style: solid;
  border-bottom-color: #1b0f1e;
  position: relative;
  font-size: 1em;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsListOptions .settingsListOption:hover {
  cursor: pointer;
  background: #2a212c;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsListOptions .settingsListOption .controlSection {
  position: absolute;
  width: calc(100%*37/200);
  height: calc(100%);
  /*background: aquamarine;*/
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsListOptions .settingsListOption .controlSection .menuCtrlIcon {
  width: calc(100%*24/37);
  height: calc(100%*24/40);
  /*background: red;*/
  margin-left: calc(100%*4/37);
  /*.margin-top(8,37,40);*/
  position: relative;
  top: calc(100%*8/40);
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsListOptions .settingsListOption .textSection {
  width: calc(100%*149/200);
  height: 100%;
  /*background: wheat;*/
  font-size: 1em;
  position: absolute;
  margin-left: calc(100%*37/200);
  color: #ffffff;
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsListOptions .settingsListOption .textSection .textBlock {
  /*background: red;*/
  font-size: 1em;
  width: calc(100%);
  height: calc(100%*14/40);
  /*.margin-top(13,149,40);*/
  position: relative;
  top: calc(100%*13/40);
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsListOptions .settingsListOption .textSection .textBlock .qualityRes {
  font-size: 1em;
  float: left;
  /*width: 40%;temporary-comment*/
}
.container .playerOverlay .playerInfoSection .popUpsSection .popUpBlock .settingsWindow .settingsListOptions .settingsListOption .textSection .textBlock .qualityResValue {
  font-size: 1em;
  float: right;
  width: 60%;
  text-align: right;
  overflow: hidden;
  text-overflow: ellipsis;
}
.container .playerOverlay .playerControlsBar {
  width: calc(100%);
  /*height:calc(100%*60/546);*/
  height: calc(100%*65.5/546);
  /*background:blue;*/
  /*background:rgba(0,0,0,0.4);*/
  position: relative;
  /*visibility: hidden;*/
  /*fix for blank space*/
  /*===================*/
  /*.controlsBackground{
				width: 100%;
				height: calc(100%*57/65.5);
				
				position: absolute;
				.margin-top(8.5,970,65.5);
			}*/
}
.container .playerOverlay .playerControlsBar .controlsBackground {
  width: 100%;
  height: calc(100%*60/65.5);
  position: absolute;
  /*.margin-top(8.5,970,14);*/
  top: calc(100%*5.5/65.5);
  background: rgba(0, 0, 0, 0.4);
}
.container .playerOverlay .playerControlsBar .progressBackground {
  width: calc(100%);
  height: calc(100%*14/65.5);
  /*background: chocolate;*/
  position: relative;
  /*.controlsBackground{
					width: 100%;
					height: calc(100%*5.5/14);
					position: absolute;
					top:calc(100%*8.5/14);
					background: @controlsBackground;

				}*/
}
.container .playerOverlay .playerControlsBar .progressBackground .progressBar {
  width: 100%;
  height: calc(100%*3/14);
  /*background:@progressBufferBackground;*/
  background: rgba(255, 255, 255, 0.2);
  /*margin-top: calc(100%*5.5/970);*/
  top: calc(100%*5.5/14);
  /*position: relative;*/
  position: absolute;
  /*=====================================*/
}
.container .playerOverlay .playerControlsBar .progressBackground .progressBar .progressBuffer {
  background: #bdbdbd;
  /*width: calc(70%);*/
  height: calc(100%);
  position: absolute;
}
.container .playerOverlay .playerControlsBar .progressBackground .progressBar .progressSeek {
  background: #bf006b;
  /*width: calc(25%);*/
  height: calc(100%);
  /*display: inline-flex;*/
  position: absolute;
}
.container .playerOverlay .playerControlsBar .progressBackground .progressBar .adProgressBar {
  background: #ffea00; /*ffad01*/
  width: calc(100%*11/970);
  height: calc(100%);
  position: absolute;
  /*display: inline-flex;*/
}
.container .playerOverlay .playerControlsBar .progressBackground .progressBar:hover {
  cursor: pointer;
}
.container .playerOverlay .playerControlsBar .progressBackground .progressHead {
  background: #bf006b;
  /*width: calc(100%*14/970);*/
  /*height: calc(100%);*/
  width: calc(100%*14/970);
  height: calc(100%);
  border-radius: 50%;
  position: absolute;
  /*display: inline-flex;*/
  /*top: calc(-100%*1.835);*/
  /*left:25%;*/
  /*&:focus{
						cursor:-webkit-grabbing;
					}*/
}
.container .playerOverlay .playerControlsBar .progressBackground .progressHead:hover {
  cursor: pointer;
}
.container .playerOverlay .playerControlsBar .playerControls {
  width: 100%;
  height: calc(100%*51.5/65.5);
  /*background: @controlsBackground;*/
  position: relative;
}
.container .playerOverlay .playerControlsBar .playerControls .leftControlsVod {
  width: calc(100%*180/970);
  height: calc(100%*47/51.5);
  /*display: inline-flex;*/
  position: absolute;
  /*background: pink;*/
  /*margin-top:calc(100%*10/970);*/
  /*.margin-top(4.5,970,51.5);//10-5.5*/
  top: calc(100%*4.5/51.5);
  /*float: left;*/
  left: 0;
}
.container .playerOverlay .playerControlsBar .playerControls .leftControlsVod .controlIcon {
  width: calc(100%*44/180);
  height: calc(100%*44/47);
  display: inline-flex;
  /*margin-left:calc(100%*0.01649485);*/
  margin-left: calc(100%*8/180);
  margin-right: calc(100%*8/180);
  /*background: yellow;*/
}
.container .playerOverlay .playerControlsBar .playerControls .leftControlsVod .controlIcon:hover {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  cursor: pointer;
}
.container .playerOverlay .playerControlsBar .playerControls .leftControlsLive {
  /*width: calc(100%*120/970); //(16*3+44*3)/970*/
  width: calc(100%*60/970);
  height: calc(100%*47/51.5);
  /*display: inline-flex;*/
  position: absolute;
  /*background: pink;*/
  /*margin-top:calc(100%*10/970);*/
  /*.margin-top(4.5,970,51.5);//10-5.5*/
  top: calc(100%*4.5/51.5);
  /*float: left;*/
  left: 0;
  /*@blockWidth:120;*/
}
.container .playerOverlay .playerControlsBar .playerControls .leftControlsLive .controlIcon {
  width: calc(100%*44/60);
  height: calc(100%*44/47);
  display: inline-flex;
  /*margin-left:calc(100%*0.01649485);*/
  margin-left: calc(100%*8/60);
  margin-right: calc(100%*8/60);
  /*background: yellow;*/
}
.container .playerOverlay .playerControlsBar .playerControls .leftControlsLive .controlIcon:hover {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  cursor: pointer;
}
.container .playerOverlay .playerControlsBar .playerControls .midControls {
  width: calc(100%*610/970);
  height: calc(100%*47/51.5);
  /*display: inline-flex;*/
  /*background: rgba(0,0,0,0.4);*/
  /*margin-top:calc(100%*10/970);*/
  /*.margin-top(4.5,970,51.5);*/
  position: absolute;
  top: calc(100%*4.5/51.5);
  left: calc(100%*180/970);
  /*.controlIcon{
						width: calc(100%*44/@blockWidth); //44/240
						height: calc(100%*44/@blockHeight);
						display : inline-flex;
						margin-left:calc(100%*8/@blockWidth);
						margin-right:calc(100%*8/@blockWidth);
						background: yellow;
					}*/
}
.container .playerOverlay .playerControlsBar .playerControls .midControls.Live {
  /*left: calc(100%*120/970);//180-44-8-8*/
  left: calc(100%*60/970);
}
.container .playerOverlay .playerControlsBar .playerControls .midControls .controlIcon {
  width: calc(100%*44/610);
  height: calc(100%*44/47);
  display: inline-flex;
  /*margin-left:calc(100%*0.01649485);*/
  margin-left: calc(100%*8/610);
  margin-right: calc(100%*8/610);
  /*background: yellow;*/
}
.container .playerOverlay .playerControlsBar .playerControls .midControls .controlIcon:hover {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  cursor: pointer;
}
.container .playerOverlay .playerControlsBar .playerControls .midControls .controlIcon {
  margin-right: calc(100%*2/610);
}
.container .playerOverlay .playerControlsBar .playerControls .midControls .volumeBar {
  width: calc(100%*72/610);
  height: calc(100%*12/47);
  /*display: inline-flex;*/
  display: none;
  /*margin-top:calc(100%*17/610);//(29-13)/610*/
  /*.margin-top(17,610,47);*/
  top: calc(100%*17/47);
  margin-right: calc(100%*7/610);
  /*margin-left: calc(100%*1/610);*/
  /*background: rgba(255,255,255,0.4);*/
  position: absolute;
  left: calc(100%*55/610);
}
.container .playerOverlay .playerControlsBar .playerControls .midControls .volumeBar .volumeBackground {
  width: calc(100%);
  height: calc(100%*3/12);
  /*margin-top: calc(100%*4/72);*/
  /*.margin-top(4,72,12);*/
  top: calc(100%*4/12);
  /*background: pink;*/
  /*background: rgba(255,255,255,0.4);*/
  background: #8b8589;
  position: absolute;
}
.container .playerOverlay .playerControlsBar .playerControls .midControls .volumeBar .volumeBackground .volumeSeek {
  /*width: calc(100%*30/72);*/
  height: calc(100%);
  background: #ffffff;
  /*								display: inline-flex;
*/
}
.container .playerOverlay .playerControlsBar .playerControls .midControls .volumeBar .volumeHead {
  width: calc(100%*12/72);
  height: calc(100%);
  /*background: yellow;*/
  background: #ffffff;
  display: inline-flex;
  border-radius: 50%;
  position: absolute;
  /*left: calc(100%*24/72);*/
}
.container .playerOverlay .playerControlsBar .playerControls .midControls .volumeBar .volumeHead:hover {
  cursor: pointer;
}
.container .playerOverlay .playerControlsBar .playerControls .midControls .volumeBar:hover {
  cursor: pointer;
}
.container .playerOverlay .playerControlsBar .playerControls .midControls .timeLapse {
  width: calc(100%*97/610);
  height: calc(100%*14/47);
  display: inline-flex;
  /*margin-top:calc(100%*16/610);//(29-13)/610*/
  /*.margin-top(16,610,47);*/
  position: absolute;
  top: calc(100%*15/47);
  /*margin-left: calc(100%*8/610);*/
  /*transition: visibility 300ms;*/
  /*left: calc(100%*134/610); //8+44+3+7+72*/
  left: calc(100%*62/610);
  /*background: crimson;*/
}
.container .playerOverlay .playerControlsBar .playerControls .midControls .timeLapse .live {
  width: calc(100%*14/97);
  height: calc(100%);
  background: #bf006b;
  /*display: inline-flex;*/
  margin-right: 5px;
  border-radius: 50%;
}
.container .playerOverlay .playerControlsBar .playerControls .midControls .timeLapse p {
  font-style: normal;
  font-family: 'Noto Sans';
  font-weight: 400;
  text-align: left;
  line-height: calc(100%*16.8/14);
  letter-spacing: 0.01em;
  color: #ffffff;
  /*-webkit-font-feature-settings: "lnum"; 
							-moz-font-feature-settings: "lnum"; 
							font-feature-settings: "lnum"; */
}
.container .playerOverlay .playerControlsBar .playerControls .rightControls {
  width: calc(100%*180/970);
  height: calc(100%*47/51.5);
  /*display: inline-flex;*/
  /*background: cyan;*/
  /*float: right;*/
  /*margin-top:calc(100%*10/970);*/
  /*.margin-top(4.5,970,57);*/
  position: relative;
  top: calc(100%*4.5/51.5);
  left: calc(100%*790/970);
}
.container .playerOverlay .playerControlsBar .playerControls .rightControls .controlIcon {
  width: calc(100%*44/180);
  height: calc(100%*44/47);
  display: inline-flex;
  /*margin-left:calc(100%*0.01649485);*/
  margin-left: calc(100%*8/180);
  margin-right: calc(100%*8/180);
  /*background: yellow;*/
}
.container .playerOverlay .playerControlsBar .playerControls .rightControls .controlIcon:hover {
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  cursor: pointer;
}
.container .playerOverlay .playerControlsBar .playerControls .rightControls .controlIcon .expandScreen {
  width: 65%;
  top: 50%;
  position: relative;
  left: 50%;
  transform: translate(-50%, -50%);
}
.container .loader {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.container .loader.errorText {
  width: calc(100%);
  height: calc(20%);
  color: white;
  text-align: center;
  font-family: 'Noto Sans';
  font-weight: 400;
}
.container .loader.errorText p {
  font-size: 14px;
  color: white;
  margin-bottom: 10px;
}
.container .loader.errorText .launchButton {
  font-size: 14px;
  color: #eeeeee;
  background-color: #bf006b;
  padding: 8px;
  margin: auto;
  line-height: 20px;
  outline: 0;
  border-radius: 3px;
  border: none;
  padding-right: 10px;
  padding-left: 10px;
  font-family: 'Raleway';
  font-weight: 600;
  font-style: normal;
  text-align: center;
  letter-spacing: 0.08em;
  opacity: 1;
}
@media only screen and (max-width: 768px) and (min-width: 481px) {
  .zee5logo {
    width: auto;
  }
}
@media only screen and (max-width: 480px) {
  .loaderPage{
    background: url("./assets/common/loading.gif") no-repeat center;
    position: fixed;
    background-color: rgb(0,0,0); 
    width: 100%; height: 100%; z-index: 2; left:0px; 
    display: none;
    background-size: 40px 40px;
  }
  .zee5logo {
    bottom: calc(100%*110/546) !important;
    width: auto;
    /*bottom: calc(100%*110/546) !important;*/
  }
  /*@media only screen and (max-width:480px) {*/
  .container {
    overflow: hidden;
  }
  .container .playerOverlay .loader {
    /*&.replay{

        }*/
  }
  .container .playerOverlay .loader.buffer {
    width: calc(100%*100/970) !important;
  }
  .container .playerOverlay .loader.error p {
    font-size: 14px;
    line-height: 18px;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
  }
  .container .playerOverlay .playerHeaderBar {
    height: calc(100%*110/546) !important;
  }
  .container .playerOverlay .playerHeaderBar .playerTitle {
    width: calc(100%) !important;
  }
  .container .playerOverlay .playerHeaderBar .playerTitle .titleTextPortrait {
    position: absolute;
    width: calc(100%*707/970);
    /*970-(3*86)-5*/
    height: calc(100%);
    left: calc(100%*21/970);
  }
  .container .playerOverlay .playerHeaderBar .playerTitle .titleTextPortrait.withBackRoute {
    left: calc(100%*86/970);
  }
  .container .playerOverlay .playerHeaderBar .playerTitle .titleTextPortrait p {
    color: #ffffff;
    font-family: 'Noto Sans';
    font-weight: 400;
    width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    letter-spacing: 0.01em;
    height: auto !important;
    font-size: 14px !important;
    line-height: 18px;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
  }
  .container .playerOverlay .playerHeaderBar .playerTitle .backRouteIcon {
    height: calc(100%*86/110);
    position: absolute;
    width: calc(100%*86/970);
    top: 50%;
    transform: translateY(-50%);
  }
  .container .playerOverlay .playerHeaderBar .playerTitle .backRouteIcon:hover {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    cursor: pointer;
  }
  .container .playerOverlay .playerHeaderBar .playerTitle .backRouteIcon .backRoute {
    width: 100%;
    /*width: 65%;*/
    top: 50%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .container .playerOverlay .playerHeaderBar .playerTitle .castControlIcon {
    width: calc(100%*86/970);
    height: calc(100%*86/110);
    right: calc(100%*86/970);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    /*z-index: 9;*/
    /*for charmboard*/
    /*top:calc(100%*4.5/86);*/
  }
  .container .playerOverlay .playerHeaderBar .playerTitle .castControlIcon:hover {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    cursor: pointer;
  }
  .container .playerOverlay .playerHeaderBar .playerTitle .shareControlIcon {
    width: calc(100%*86/970);
    height: calc(100%*86/110);
    right: calc(0%);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    /*top:calc(100%*4.5/86);*/
  }
  .container .playerOverlay .playerHeaderBar .playerTitle .shareControlIcon:hover {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    cursor: pointer;
  }
  .container .playerOverlay .playerHeaderBar .playerTitle .shareControlIcon .shareIcon {
    width: 50%;
    height: 50%;
    top: 50%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .container .playerOverlay .playerHeaderBar .shareOptions {
    position: absolute;
    right: 0px;
    top: 100%;
    z-index: 1;
  }
  .container .playerOverlay .playerInfoSection {
    /*height: 60%;*/
    height: calc(100%*326/546) !important;
  }
  .container .playerOverlay .playerControlsBar {
    height: calc(100%*110/546) !important;
  }
  .container .playerOverlay .playerControlsBar .controlsBackground {
    /*height:calc(100%) !important;*/
    height: calc(100%*99.5/110) !important;
    /*top: 0% !important;*/
    top: calc(100%*10.5/110) !important;
  }
  .container .playerOverlay .playerControlsBar .progressBackground {
    height: calc(100%*24/110) !important;
  }
  .container .playerOverlay .playerControlsBar .progressBackground .progressBar {
    height: calc(100%*3/24) !important;
    top: calc(100%*10.5/24) !important;
  }
  .container .playerOverlay .playerControlsBar .progressBackground .progressHead {
    width: calc(100%*24/970) !important;
  }
  .container .playerOverlay .playerControlsBar .playerControls {
    /*height: calc(100%) !important;*/
    height: calc(100%*86/110) !important;
    /*top:calc(100%*24/110) !important;*/
  }
  .container .playerOverlay .playerControlsBar .playerControls .controlIconPlay {
    width: calc(100%*86/970) !important;
    height: calc(100%) !important;
    /*left: calc(0%) !important;*/
    position: relative;
    float: left;
    margin-left: calc(100%*4/970) !important;
    margin-right: calc(100%*4/970) !important;
    /*top:calc(100%*4.5/86);*/
  }
  .container .playerOverlay .playerControlsBar .playerControls .controlIconPlay:hover {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    cursor: pointer;
  }
  .container .playerOverlay .playerControlsBar .playerControls .controlIconVolume {
    width: calc(100%*86/970) !important;
    height: calc(100%) !important;
    /*left: calc(0%) !important;*/
    position: relative;
    float: left;
    margin-left: calc(100%*4/970) !important;
    margin-right: calc(100%*4/970) !important;
    /*top:calc(100%*4.5/86);*/
  }
  .container .playerOverlay .playerControlsBar .playerControls .controlIconVolume:hover {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    cursor: pointer;
  }
  .container .playerOverlay .playerControlsBar .playerControls .timeLapseMobile {
    /*top:calc(100%*4.5/106);*/
    width: calc(100%*676/970) !important;
    height: calc(100%) !important;
    /*left: calc(100%*125/970) !important;   */
    position: relative;
    float: left;
    margin-left: calc(100%*12/970) !important;
    color: #ffffff;
  }
  .container .playerOverlay .playerControlsBar .playerControls .timeLapseMobile .live {
    float: left;
    background: #bf006b;
    margin-right: 5px;
    border-radius: 50%;
    width: calc(100%*14/676) !important;
    height: calc(100%*14/86) !important;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
  }
  .container .playerOverlay .playerControlsBar .playerControls .timeLapseMobile p {
    float: left;
    font-size: 14px !important;
    line-height: 18px;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
  }
  .container .playerOverlay .playerControlsBar .playerControls .controlIconFullscreen {
    width: calc(100%*86/970) !important;
    height: calc(100%) !important;
    right: calc(0%) !important;
    position: absolute;
    margin-left: calc(100%*4/970) !important;
    margin-right: calc(100%*4/970) !important;
    /*top:calc(100%*4.5/106);*/
  }
  .container .playerOverlay .playerControlsBar .playerControls .controlIconFullscreen .expandScreen {
    width: 65%;
    top: 50%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .container .playerOverlay .playerControlsBar .playerControls .controlIconFullscreen:hover {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    cursor: pointer;
  }
}

/***********************Share Options Start******************************/
.shareicon {
  cursor: pointer;
}
.shareoptions {
  height: 43px;
  width: 147px;
}
.popupPatch {
  width: 7px;
  margin-top: 15px;
  float: left;
}
.logosContainer {
  display: inline-block;
  width: 90px;
  height: 43px;
  background-color: #6e6e6e;
  margin-right: 10px;
  float: right;
}
.fb {
  float: left;
  margin-left: 12px;
  margin-top: 11px;
}
.googleplus {
  float: left;
  margin-left: 21px;
  margin-top: 12px;
}
.share_outer {
  width: calc(100%);
  height: calc(100%);
}
.email {
  float: left;
  margin-left: 17px;
  margin-top: 13px;
}
/***********************Share Options End******************************/


/********************Toggle button Start**********************/
.toggleContainer {
  width: 100%;
  height: 100%;
  /*background: #282728;*/
  position: relative;
  /*border-radius: calc(100%);*/
  /*.border-radius-rect(44,22);*/
}
.toggleContainer .left {
  width: calc(100%*22/44);
  height: calc(100%*22/22);
  position: absolute;
  background: #282728;
  border-radius: 50%;
  left: 0;
}
.toggleContainer .center {
  width: calc(100%*22/44);
  height: calc(100%*22/22);
  position: absolute;
  background: #282728;
  left: calc(100%*11/44);
}
.toggleContainer .right {
  width: calc(100%*22/44);
  height: calc(100%*22/22);
  position: absolute;
  background: #282728;
  border-radius: 50%;
  right: 0;
}
.toggleContainer .toggleBackground {
  /*width: 32px;
    height: 14px;*/
  width: calc(100%*32/44);
  height: calc(100%*14/22);
  /*background: white;*/
  position: absolute;
  /*.margin-top(4,44,22);*/
  top: calc(100%*4/22);
  margin-left: calc(100%*6/44);
}
.toggleContainer .toggleBackground .toggleHead {
  /*width: 14px;
      height: 14px;*/
  width: calc(100%*14/32);
  height: calc(100%*14/14);
  position: absolute;
  background: #666466;
  border-radius: 50%;
  left: 0;
  /*animation: left 0.5s;*/
}
.toggleContainer .toggleBackground .toggleHead.active {
  background: #b80067;
  /*right: 0;*/
  /*animation: right 0.5s;*/
  left: calc(100%*18/32);
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes right {
  from {
    left: 0;
    background: #666466;
  }
  to {
    left: calc(100%*18/32);
    background: #b80067;
  }
}
/* Standard syntax */
@keyframes right {
  from {
    left: 0;
    background: #666466;
  }
  to {
    left: calc(100%*18/32);
    background: #b80067;
  }
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes left {
  from {
    left: calc(100%*18/32);
    background: #b80067;
  }
  to {
    left: 0;
    background: #666466;
  }
}
/* Standard syntax */
@keyframes left {
  from {
    left: calc(100%*18/32);
    background: #b80067;
  }
  to {
    left: 0;
    background: #666466;
  }
}

/********************Toggle button End**********************/

/*************************Error page*************************/
.errorPage{
  text-align: center;
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #000000;
  opacity: 0.8;
  z-index: 10;
}
.errorPageOuterContainer {
  display: none;
  position: absolute;
  width: 768px;
  height: 432px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-family: 'Raleway';
  font-weight: 400;
}
@media only screen and (max-width: 768px) and (min-width: 481px) {
.errorPageOuterContainer {
  width: 100%; 
}
}
@media only screen and (max-width: 480px) {
.errorPageOuterContainer {
  width: 320px; 
  height: 200px;
}
}
/*************************Error page*************************/

/*************************Video error Start*************************/
.videoErrorLogo{
  margin-top: 75px;
}
.videoErrorHeader1{
  font-size: 30px;
  color: #757575;
  margin-top: 20px;
  line-height: 40px;
}
.videoErrorHeader2{
  font-size: 20px;
  color: #ffffff;
  margin-top: 10px;
  line-height: 26px;
}
.videoErrorReplayButton{
  margin-top: 36px;
  cursor: pointer;
}
.videoReplayString{
  font-size: 13px;
  color: #ffffff;
  // margin-bottom: 64px;
  line-height: 26px;
}
@media only screen and (max-width: 480px) {
.videoErrorLogo{
  margin-top: 30px;
}
.videoErrorHeader1{
  font-size: 16px;
  margin-top: 6px;
  line-height: 20px;
}
.videoErrorHeader2{
  font-size: 11px;
  margin-top: 6px;
  line-height: 16px;
}
.videoErrorReplayButton{
  margin-top: 14px;
  width: 30px;
}
.videoErrorReplayButton:hover {
  cursor: pointer;
  z-index: 1;
}
.videoReplayString{
  font-size: 8px;
  // margin-bottom: 14px;
  line-height: 14px;
}
}
/*************************Video error End*************************/
/*************************Geographic error Start*************************/
.GeographicErrorLogo{
  margin-top: 75px;
}
.GeographicErrorHeader1{
  font-size: 30px;
  color: #757575;
  margin-top: 20px;
  line-height: 40px;
}
.GeographicErrorHeader2{
  font-size: 20px;
  color: #ffffff;
  margin-top: 10px;
  line-height: 26px;
}
.GeographicReplayString{
  margin-bottom: 75px;
  margin-top: 75px;
}
.GeographicFontString{
  font-size: 16px;
  color: #ffffff;
  text-decoration: underline;
  line-height: 20px;
}
@media only screen and (max-width: 480px) {
.GeographicErrorLogo{
  margin-top: 40px;
}
.GeographicErrorHeader1{
  font-size: 16px;
  margin-top: 6px;
  line-height: 20px;
}
.GeographicErrorHeader2{
  font-size: 11px;
  margin-top: 0px;
  line-height: 16px;
}
.GeographicReplayString{
  margin-bottom: 40px;
  margin-top: 10px;
}
.GeographicFontString{
  font-size: 8px;
  line-height: 14px;
}
}
/*************************Geographic error End*************************/

/*************************Premium error Start*************************/
.premiumErrorLogo{
  margin-top: 75px;
}
.premiumErrorHeader1{
  font-size: 30px;
  color: #757575;
  margin-top: 33px;
  line-height: 40px;
}
.premiumErrorHeader2{
  font-size: 20px;
  color: #ffffff;
  margin-top: 42px;
  line-height: 26px;
}
.premiumErrorButton{
  margin-top: 12px;
  padding: 10px;
}
.premiumFontString{
  padding: 10px;
  background: #b80067;
  font-size: 18px;
  color: #ffffff;
  line-height: 20px;
  font-family: 'Noto Sans';
  font-weight: 400;
}
@media only screen and (max-width: 480px) {
.premiumErrorLogo{
  margin-top: 28px;
}
.premiumErrorHeader1{
  font-size: 16px;
  margin-top: 12px;
  line-height: 20px;
}
.premiumErrorHeader2{
  font-size: 11px;
  margin-top: 10px;
  line-height: 16px;
}
.premiumErrorButton{
  margin-bottom: 14px;
  margin-top: 4px;
  padding: 7px;
}
.premiumFontString{
  padding: 7px;
  font-size: 11px;
  line-height: 14px;
}
}
/*************************Premium error End*************************/

/*************************Premium Regional error Start*************************/
.premiumRegErrorLogo{
  margin-top: 75px;
}
.premiumRegErrorHeader1{
  font-size: 30px;
  color: #757575;
  margin-top: 33px;
  line-height: 40px;
}
.premiumRegReplayString{
  margin-bottom: 75px;
  margin-top: 75px;
}
.premiumRegFontString{
  font-size: 16px;
  color: #ffffff;
  text-decoration: underline;
  line-height: 20px;
}
@media only screen and (max-width: 480px) {
.premiumRegErrorLogo{
  margin-top: 28px;
}
.premiumRegErrorHeader1{
  font-size: 16px;
  margin-top: 12px;
  line-height: 20px;
}
.premiumRegReplayString{
  margin-bottom: 40px;
  margin-top: 10px;
}
.premiumRegFontString{
  font-size: 8px;
  line-height: 14px;
}
}
/*************************Premium Regional error End*************************/


/*************************Cast Desktop Start*************************************/
.castBlock {
  z-index: 1;
  font-family: 'Noto Sans';
  font-weight: 400;
  position: absolute;
  font-size:14px;
}
.castBlock .castControlsContainer {
  position: fixed;
  bottom: 0px;
  background: #1b0f1e;
  font-size: 1em;
  width:70%;
  max-height:90px;
  left:15%;
}
.castBlock .castControlsContainer .titleContainer {
  /*width: calc(100%*800/801);*/
  width: calc(100%);
  height: calc(49.46236559%);
  font-size: 1em;
  position: relative;
}
.castBlock .castControlsContainer .titleContainer .castConnectionTitle {
  /*width: 100%;*/
  width: calc(94.25%);
  height: calc(100%);
  /*background: cyan;*/
  font-size: 1em;
  position: absolute;
  /*display: inline-flex;*/
}
.castBlock .castControlsContainer .titleContainer .castConnectionTitle .title {
  font-size: 1em;
  position: absolute;
  top: calc(43.47826087%);
  letter-spacing: 0.01em;
  color: #6e6e6e;
  left: calc(2.65251989%);
}
.castBlock .castControlsContainer .titleContainer .castConnectionTitle .title .nowCasting{
  font-size: 1em;
  letter-spacing: 0.01em;
  color: #6e6e6e;
 }
.castBlock .castControlsContainer .titleContainer .castConnectionTitle .title .castName {
  font-size: 1em;
  letter-spacing: 0.01em;
  color: #eeeeee;
}
.castBlock .castControlsContainer .titleContainer .controlsBlock {
  width: calc(5.75%);
  height: calc(100%);
  /*display: inline-flex;*/
  position: absolute;
  right: 0;
  /*background: green;*/
}
.castBlock .castControlsContainer .titleContainer .controlsBlock .controlIcon {
  width: calc(52.17391304%);
  height: calc(52.17391304%);
  /*background: red;*/
  position: absolute;
  top: calc(32.60869565%);
  cursor: pointer;
}
.castBlock .castControlsContainer .castControlsSection {
  /*width: calc(100%*800/801);*/
  width: calc(100%);
  height: calc(50.53763441%);
  /*background: pink;*/
  font-size: 1em;
  position: relative;
}
.castBlock .castControlsContainer .castControlsSection .videoTitleSection {
  /*background: purple;*/
  width: calc(38.75%);
  height: calc(100%);
  font-size: 1em;
  position: absolute;
  /*display: inline-flex;*/
}
.castBlock .castControlsContainer .castControlsSection .videoTitleSection .videoTitle {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 1em;
  width: calc(91.30434783%);
  height: calc(74.46808511%);
  position: absolute;
  top: calc(25.53191489%);
  /*background: pink;*/
  letter-spacing: 0.01em;
  left: calc(6.69565217%);
  color: #eeeeee;
  /*line-height: 1.37142857em;*/
}

.castBlock .castControlsContainer .castControlsSection .castPausePlayControl {
  /*background: purple;*/
  width: calc(5.5%);
  height: calc(100%);
  /*display: inline-flex;*/
  position: absolute;
  left: calc(40.375%);
  top: 0;
}
.castBlock .castControlsContainer .castControlsSection .castPausePlayControl .controlIcon {
  /*background: red;*/
  width: calc(54.54545455%);
  height: calc(51.06382979%);
  margin-left: calc(45.45454545%);
  display: inline-flex;
  position: absolute;
  top: calc(14.89361702%);
  cursor: pointer;
}
.castBlock .castControlsContainer .castControlsSection .castProgressTime {
  /*background: yellow;*/
  width: calc(6.625%);
  height: calc(100%);
  font-size: 1em;
  position: absolute;
  top: 0;
  left: calc(45.875%);
}
.castBlock .castControlsContainer .castControlsSection .castProgressTime .timeLapseCast {
  /*background: brown;*/
  width: calc(100%);
  height: calc(72.34042553%);
  font-size: 0.9em;
  position: absolute;
  top: calc(27.65957447%);
  text-align: center;
  letter-spacing: 0.01em;
  color: #6e6e6e;
}
.castBlock .castControlsContainer .castControlsSection .castProgressBarBlock {
  /*background: blue;*/
  /*width: calc(100%*269/800);*/
  width: calc(38%);
  /*269->304*--after removing full screen*/
  height: calc(100%);
  font-size: 1em;
  position: absolute;
  top: 0;
  left: calc(52.5%);
}
.castBlock .castControlsContainer .castControlsSection .castProgressBarBlock .progressBackground {
  background: #464646;
  width: 100%;
  /*height: calc(100%*1/47);*/
  /*commented to fix issue with resize ... 1px not getting recognized*/
  height: 1px;
  position: absolute;
  top: calc(38.29787234%);
  cursor: pointer;
}
.castBlock .castControlsContainer .castControlsSection .castProgressBarBlock .progressBackground .progressBarCast {
  background: #bf006b;
  /*width: 30%;*/
  /*height: calc(100%*2/47);*/
  height: calc(100%);
  position: absolute;
  cursor: pointer;
  /*top:calc(100%*18/47);*/
}
.castBlock .castControlsContainer .castControlsSection .castDurationTime {
  /*background: white;*/
  width: calc(6.625%);
  height: calc(100%);
  font-size: 1em;
  position: absolute;
  top: 0;
  /*left: calc(100%*689/800);//230+93+44+269*/
  left: calc(90.5%);
}
.castBlock .castControlsContainer .castControlsSection .castDurationTime .live {
  background: #bf006b;
  border-radius: 50%;
  width: calc(22.64150943%);
  height: calc(25.53191489%);
  top: calc(27.65957447%);
  position: absolute;
  margin-left: calc(9.43396226%);
}
.castBlock .castControlsContainer .castControlsSection .castDurationTime .timeDuration {
  /*background: brown;*/
  width: calc(100%);
  height: calc(72.34042553%);
  font-size: 0.9em;
  position: absolute;
  top: calc(27.65957447%);
  text-align: center;
  letter-spacing: 0.01em;
  color: #6e6e6e;
}
/*************************Cast Desktop End*************************/

/*************************Cast Mobile Start*************************/

.castBlockMobile {
  z-index: 1;
  font-family: 'Noto Sans';
  font-weight: 400;
  position: absolute;
  font-size: 14px;
  display: none;
}
.castBlockMobile .castContainer {
  width: 100%;
  height: 140px;
  position: fixed;
  bottom: 0px;
  /*background: @castBackground;*/
  font-size: 1em;
}

.castBlockMobile .castContainer .outerContainer {
  font-size: 1em;
  float: left;
  background: #1b0f1e;
  height: 100%;
  width: 100%;
}
.castBlockMobile .castContainer .outerContainer .titleContainer {
  font-size: 1em;
  /*background: red;*/
  width: 100%;
  height: 25%;
}
.castBlockMobile .castContainer .outerContainer .titleContainer .controlsBlock {
  width: 60px;
  height: 100%;
  float: right;
}
.castBlockMobile .castContainer .outerContainer .titleContainer .controlsBlock .controlIcon {
  width: 40px;
  height: 100%;
  margin-right: 10px;
  margin-left: 10px;
  overflow: hidden;
  cursor: pointer;
}
.castBlockMobile .castContainer .outerContainer .titleContainer .castConnectionTitle {
  height: 100%;
  font-size: 1em;
  float: left;
}
.castBlockMobile .castContainer .outerContainer .titleContainer .castConnectionTitle .title {
  font-size: 1em;
  position: relative;
  letter-spacing: 0.01em;
  color: #6e6e6e;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
}
.castBlockMobile .castContainer .outerContainer .titleContainer .castConnectionTitle .title .nowCasting{
  font-size: 1em;
  letter-spacing: 0.01em;
  color: #6e6e6e;
 }
.castBlockMobile .castContainer .outerContainer .titleContainer .castConnectionTitle .title .castName {
  font-size: 1em;
  letter-spacing: 0.01em;
  color: #eeeeee;
}
.castBlockMobile .castContainer .outerContainer .innerContainer {
  font-size: 1em;
  /*background: white;*/
  width: 100%;
  height: 25%;
  overflow: hidden;
}
.castBlockMobile .castContainer .outerContainer .innerContainer .videoTitleSection {
  height: 100%;
  font-size: 1em;
  float: left;
  width:100%;
}
.castBlockMobile .castContainer .outerContainer .innerContainer .videoTitleSection .videoTitle {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 1.14285714em;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  letter-spacing: 0.01em;
  color: #eeeeee;
  left: 20px;
  line-height: 20px;
  width: calc(100% - 20px);
}

.castBlockMobile .castContainer .outerContainer .castControlsSection {
  width: 100%;
  font-size: 1em;
  /*background: red;*/
  /*position: absolute;*/
  /*top: calc(100%*80/140);*/
  height: 50%;
}
.castBlockMobile .castContainer .outerContainer .castControlsSection .castPausePlayControl {
  float: left;
  width: 40px;
  height: 100%;
}
.castBlockMobile .castContainer .outerContainer .castControlsSection .castPausePlayControl .controlIcon {
  width: 100%;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
}
.castBlockMobile .castContainer .outerContainer .castControlsSection .castProgressTime {
  font-size: 1em;
  float: left;
  width: 56px;
  height: 100%;
}
.castBlockMobile .castContainer .outerContainer .castControlsSection .castProgressTime .timeLapseCast {
  font-size: 1em;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  color: #eeeeee;
}
.castBlockMobile .castContainer .outerContainer .castControlsSection .castProgressBarBlock {
  width: calc(100% - 162px);
  /*100-pause-padding-2*time==-40-10-2(56)*/
  padding-left: 5px;
  float: left;
  height: 100%;
}
.castBlockMobile .castContainer .outerContainer .castControlsSection .castProgressBarBlock .progressBackground {
  background: #464646;
  width: 100%;
  height: 2px;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
}
.castBlockMobile .castContainer .outerContainer .castControlsSection .castProgressBarBlock .progressBackground .progressBarCast {
  background: #bf006b;
  height: 100%;
  cursor: pointer;
}
.castBlockMobile .castContainer .outerContainer .castControlsSection .castDurationTime {
  font-size: 1em;
  float: right;
  width: 56px;
  height: 100%;
}
.castBlockMobile .castContainer .outerContainer .castControlsSection .castDurationTime .live {
  float: left;
  background: #bf006b;
  margin-right: 5px;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
.castBlockMobile .castContainer .outerContainer .castControlsSection .castDurationTime .timeDuration {
  float: left;
  font-size: 1em;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
      color: #eeeeee;
}
/*************************Cast Mobile End*************************/

/********************Suggestion Page**************************/
.suggestionPage {
   color:#ffffff;
  font-size: 12px;
  text-align: center;
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 10;
  background : rgba(0,0,0,0.8)
}
.suggestionPage_outerContainer{
  width:87%;
  /*width:100%;*/
  position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
      -moz-transform:translate(-50%,-50%);
      -ms-transform:translate(-50%,-50%);
      transform:translate(-50%,-50%);  
  padding-bottom: 10px;
/*      max-width: 960px;
    max-height: 437px;*/
}
.suggestionPage_innerContainer {
  /*margin-left:5.75%;*/
  position: relative;
  display: inline-block;
}
.suggestedtvshows {
  overflow:hidden;
  height:100%;
  white-space: nowrap; 
  float: left;

}
 .suggestedtvshows::-webkit-scrollbar {
  display: none;
}
.suggestionPage_replayContainer {
  display: block;
  /*display: inline-block;*/
  position: relative;
}
.suggestionPage_replayIcon {
    margin-bottom: 7px;
    margin-top: 15px;
}
.castreplayIcon {
       /*margin-top: 5%;*/
    position: relative;
    cursor: pointer;
}
.replayText {
   color:#ffffff;
  font-size: 12px;
  text-align: center;
}
.tvshowImageHolder {
  position: relative;
  float: left;
  display: inline-block;
  margin-top:4%;
  width:28vw;
  /*width:30%;*/
  margin-right: 1vw;
  /*margin-right: 2.1%;*/
  cursor: pointer;
}
.tvshowImage {
  width:100%;
  height:inherit;
}
.playImage{ 
  position: absolute;
 /* bottom: 5px;
  left:5px;*/
  left:3%;
  bottom: 5%;
  z-index: 3;
 }
 .prev_icon,.next_icon {
  position:fixed;
  display: none;
  cursor: pointer;
  top: 13vw;
  -webkit-tap-highlight-color: transparent;
 }
 .next_icon {
  right: 0px;
 }
 .prev_image,.next_image {
   /*top: 13vw;*/
   position: relative;
 }

@media only screen and (max-width: 768px) and (min-width: 481px) {
  .suggestionPage_replayContainer {
  top:5%;
 }
 .replayText {
   font-size: 10px;
 }
}

@media only screen and (max-width: 480px) {
.suggestionPage_outerContainer{
     width: 95%;
 }
 .suggestionPage_innerContainer {
   height:32vw;
  margin-left: 0%;
  display: block;
 }
 .suggestedtvshows {
    overflow: auto !important;
    width: calc(100% - 44px);
    margin-left: 22px;
  }
 .tvshowImageHolder {
    width: 49%;
    margin-right: 3.1%;
    float: none;
 }
 .suggestionPage_replayContainer {
  position: absolute;
  left:calc(50% - 15px);
 }
  .next_icon {
     display: block;
   }
   .prev_icon {
    display: none
   }
   .suggestionPage_replayIcon {
    margin-bottom: 5px;
    margin-top: 5px;
}
 .replayText {
   font-size: 10px;
 }
}