
.position {
  float: left;
  margin: 0 0 0 10px;
	
}

.progress-bar-circle-list {
	width: max-content;
    margin-right: 23px;
}

.progress-bar-circle {
  position: relative;
  height: 60px;
  width: 60px;
  cursor: pointer;
  margin-left: 10px;
  margin-top: 34px;
  border-radius: 50%;
}
.progress-bar-circle-list>div:first-of-type {
  margin-left: 20px !important;
}

.details-container .progress-bar-circle {
  margin-left: calc( 50% - 25px ) !important;
}
.main-snatches .snatch .progress-bar-circle {
    margin-left: calc( 50% - 29px ) !important;
    -webkit-transform: scale(0.85);
        -ms-transform: scale(0.85);
            transform: scale(0.85);
}

.snatch.HandicapSnatch.total .progress-bar-circle {
  cursor: default;
}


/*.progress-bar-circle:after {
    content: '';
    width: 59px;
    height: 58px;
    border-radius: 50%;
    
    border: 1px solid #f0f0f0;
    z-index: 1;
    position: absolute;
    display: block;
    left: 0px;
    top: 0px;
}*/

/*#body.view_1024 .progress-bar-circle:after {  
  content: ''; 
  border:none; 
}*/
.circle-position-bet {
    position: absolute;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    text-align: center;
    line-height: 44px;
    left: 8px;
    top: 8px;
    z-index: 99;
    color: #4C4C4C;
    font-size: 13px;
    font-family: 'CrystalBetUni-Medium';
    /*background: #F0F0F0;*/
    /*cursor: pointer !important;*/
}

.HandicapSnatch.total .circle-position-bet {
   background: #dbdbdb;
   cursor: default !important;

}

.HandicapSnatch.total .progress-bar-circle:hover .circle-position-bet {
   background: #dbdbdb;
   color: #6d6d6d;
   cursor: default !important;
}

.snatch .progress-bar-circle.active .circle-position-bet, .snatch.SnatchSelected .circle-position-bet {
	background: #FDE053;
	color: #262000;

}
 
.snatch .progress-bar-circle:hover .circle-position-bet {
    background: #ffe242;
    color: #262000;
    
}

.snatch .progress-bar-circle:hover .circle-position-bet:after {
    width: 61px;
    height: 61px;
    border-radius: 100%;
    top: -8px !important;
    left: -8px !important;
    z-index: -1;
    opacity: 0.5;
    font-size: 13.5px;
    content: '';
    position: absolute;
    background-color: rgb(255,226,66);
}
.fora .circle-position-bet {
      line-height: 15px;
    padding-top: 7px;
    box-sizing: border-box;
}


.progress-bar-circle.LiveBetSnatchSelected {
	background: initial;
}


.circle-position {
	display: block;
  position: relative;
  top: -46px;
  color: #4C4C4C;
}
.DarkMode .content-holder .circle-position,
.DarkMode .betconstructor .circle-position {
  color: #E6E6E6;
}
/*.circle-bet {
	display: none;
}*/

/*.progress-bar-circle:hover .circle-position {
	display: none;
}*/
.progress-bar-circle .circle-bet {
  display: block;
    width: 44px;
    height: 44px;
    border-radius: 100%;
    top: 0px;
    left: 0px;
    z-index: 1;
    line-height: 45px;
    position: absolute;
    background-color: #f0f0f0;
    color: #262626;
    font-weight: normal;
    font-size: 13px;
    cursor: pointer;
}
.DarkMode .content-holder .progress-bar-circle .circle-bet,
.DarkMode .betconstructor .progress-bar-circle .circle-bet {
  color: #D8D8D8;
  background-color: #4C4C4C;
}
/*.progress-bar-circle:hover .circle-bet:after {
  display: block;
  content: '';
}*/
.game_loading_content .progress-bar-circle:hover .circle-bet.handicap:after {
  width: 64px;
  height: 62px;
}
/*.progress-bar-circle.active .circle-position {
	display: none;
}*/
.progress-bar-circle.active .circle-bet {
	display: block;
}


.progress-bar-circle div {
  position: absolute;
  height: 60px !important;
  width: 60px;
  border-radius: 50%;
}

.progress-bar-circle-div-span {
    position: absolute;
    font-family: 'CrystalBetUni-Medium';
    font-size: 15px;
    line-height: 45px;
    height: 44px !important;
    width: 44px !important;
    left: 8px;
    top: 6px;
    text-align: center;
    border-radius: 50%;
    background-color:  #F0F0F0;
}
.DarkMode .betconstructor .progress-bar-circle-div-span {
    background-color:  #474747;
    height: 44px !important;
}
.progress-bar-circle-div-span div {
	position: relative;
	top: 50px;
	font-size: 13px;
	font-family: 'CrystalBetUni-Bold';
  color: #1A1A1A;
  left: -5px;
}
.DarkMode .content-holder .progress-bar-circle-div-span div,
.DarkMode .betconstructor .progress-bar-circle-div-span div {
  color: #E6E6E6;
}

.snatch.HandicapSnatch.total .progress-bar-circle-div-span div {
  display: none;
}


.progress-bar-circle .background { 
  background-color: #CCCCCC !important;
}
.DarkMode .content-holder .progress-bar-circle .background,
.DarkMode .betconstructor .progress-bar-circle .background  {
  background-color: #333333 !important;
}
.progress-bar-circle .rotate {
  clip: rect(0 30px 60px 0);
  background-color: #33B52A !important;
	border-left: 1px solid #cccccc;
}
.DarkMode .content-holder .progress-bar-circle .rotate,
.DarkMode .betconstructor .progress-bar-circle .rotate  {
    border-left: none;
   background-color: #33B52A !important;
}
.progress-bar-circle .left {
  clip: rect(0 30px 60px 0);
  opacity: 1;
  background-color: #cccccc !important;
}
.DarkMode .content-holder .progress-bar-circle .left,
.DarkMode .betconstructor .progress-bar-circle .left {
  background-color: #333333  !important;
}
.progress-bar-circle .right {
  clip: rect(0 30px 60px 0);
  transform: rotate(180deg);
  opacity: 0;
  background-color: #33B52A !important;
}
 @keyframes 
toggle {  0% {
 opacity: 0;
}
 100% {
 opacity: 1;
}
}

.game_loading_content .progress-bar-circle-div-span {
    font-family: unset;
    font-size: unset;
    line-height: unset;
    height: unset;
    width: 60px !important;
    left: 8px;
    top: 6px;
    text-align: center;
    border-radius: unset !important;
    background-color: unset;
}
.progress-bar-circle:hover .circle-bet {
    color: #262000;
    background-color: #FDE053;
}

.progress-bar-circle:hover .background {
    background-color: #E4C428 !important;
}
.progress-bar-circle:hover .rotate {
    background-color: #A79223 !important;
    background: #A79223 !important;
}
.progress-bar-circle:hover .left {
    background-color: rgb(228,196,40) !important;
}
.progress-bar-circle:hover .right {
    background-color: rgb(170, 150, 49) !important;
}
.circle-bet.total,.circle-bet.handicap {
    background: #D8D8D8;
    border-radius: 50%;
    line-height: 60px;
    width: 61px;
    height: 60px;
    top: -8px;
    left: -9px;
    padding-top: 0px;
}
.DarkMode .content-holder .circle-bet.total,
.DarkMode .betconstructor .circle-bet.total  {
    background: #333333 ;
    border-radius: 50%;
    line-height: 60px;
    width: 61px;
    height: 60px;
    top: -8px;
    left: -9px;
}
.DarkMode .content-holder .progress-bar-circle:hover .circle-bet,
.DarkMode .betconstructor .progress-bar-circle:hover .circle-bet  {
    color: #262000;
    background-color: #FDE053;
}
.snatch .circle-position-bet {
    color: #262626;
}
.DarkMode .betconstructor .snatch .circle-position-bet {
    color: #D8D8D8;
}
.DarkMode .betconstructor .snatch.SnatchSelected .circle-position-bet,
.DarkMode .betconstructor .snatch .circle-position-bet:hover {
    color: #262000;
}
.main-snatch .progress-bar-circle-div-span {
  top: 8px;
  height: 44px !important;

}
.snatch .progress-bar-circle:hover .circle-position-bet:after {
  display: none;
}
.main-snatch .progress-bar-circle {
  cursor: pointer;
}
.main-snatch .progress-bar-circle:hover {
  cursor: pointer;
}
.main-snatch .progress-bar-circle:hover .circle-position-bet {
  cursor: pointer;
}
/*.snatch.HandicapSnatch.total .background {
  background-color: #d8d8d8 !important;

}
.snatch.HandicapSnatch.total .circle-position-bet {
  background-color: #d8d8d8 !important;
}
.snatch.HandicapSnatch.total .left {
  background-color: #d8d8d8 !important;
}*/
.snatch.HandicapSnatch.total .circle-position-bet {
    width: 60px;
    height: 60px;
    left: 0px;
    top: 0px;
    background-color: #d8d8d8;
    color: #262626;
    line-height: 60px;
} 
.snatch.HandicapSnatch.total .progress-bar-circle:hover .snatch.HandicapSnatch.total .circle-position-bet{
    background: #FDE053;
}
.HandicapSnatch.total .progress-bar-circle:hover .circle-position-bet {
    background: #d8d8d8;
    color: #262000;

}
.DarkMode .betconstructor .HandicapSnatch.total .progress-bar-circle .circle-position-bet {
    color: #D8D8D8;
    background-color: #333333;;
}
.DarkMode .betconstructor .HandicapSnatch.total .progress-bar-circle:hover .circle-position-bet {
    color: #262000;
    background-color: #FDE053;
}

.progress-bar-circle.LiveBetSnatchSelected.active .circle-bet  {
    background: #FDE053;
    color: #262000;
}
.game_loading_content .progress-bar-circle .circle-bet.handicap {
/*    line-height: 37px;
    width: 50px;
    height: 43px;
    left: -3px;
    top: -3px;
    font-size: 12px;
    overflow: hidden;*/
}
.DarkMode .content-holder .progress-bar-circle:hover .background {
    background-color: #E4C428 !important;
}
.DarkMode .content-holder .progress-bar-circle:hover .rotate {
    background-color: #A79223 !important;
    background: #A79223 !important;
}
.DarkMode .content-holder .progress-bar-circle:hover .left {
    background-color: rgb(228,196,40) !important;
}
.main-snatches.count-13 .main-snatch .snatch.Snatch .progress-bar-circle.position .progress-bar-circle-div-span {
    height: 44px !important;
}