/* home Timeline */
.achievement-box.secondary{background:url('/site/imgs/achievement/01.jpg') no-repeat 50%;background-size:cover}
.achievement-box.primary{background:url('/site/imgs/achievement/02.jpg') no-repeat 50%;background-size:cover}

.widget-box .widget-box-content{margin-top:26px}
.bloc-avatar{width:100px;height:100px;margin-top:5px;position: absolute;z-index: 5;left: 0;top: 5px;zoom:0.7;margin:0 0 0 20px}
.bloc-avatar svg{width:64px;height:84px;margin-top:8px;margin-left:0px}
.list-friends-home .bloc-avatar{left: -20px;top: -12px;zoom: 0.6;margin: 0 0 10px 20px;}
.list-friends-home .user-status{padding: 2px 0 10px 52px;}
	
.circlepts{position:absolute;left:-22px;top:-22px}
.circlepts circle {stroke-dashoffset: 0;transition: stroke-dashoffset 1s linear;stroke-width:8px}
.circlepts circle {stroke-dashoffset:280px}

.circlepts.pts20 circle{stroke-dashoffset:340px;animation:dash20 1s linear forwards}
.circlepts.pts19 circle,.circlepts.pts18 circle{stroke-dashoffset:360px;animation:dash18 1s linear forwards}
.circlepts.pts17 circle,.circlepts.pts16 circle{stroke-dashoffset:380px;animation:dash16 1s linear forwards}
.circlepts.pts15 circle,.circlepts.pts14 circle{stroke-dashoffset:400px;animation:dash14 1s linear forwards}
.circlepts.pts13 circle,.circlepts.pts12 circle{stroke-dashoffset:425px;animation:dash12 1s linear forwards}
.circlepts.pts11 circle,.circlepts.pts10 circle{stroke-dashoffset:455px;animation:dash10 1s linear forwards}
.circlepts.pts9 circle,.circlepts.pts8 circle{stroke-dashoffset:470px;animation:dash8 1s linear forwards}
.circlepts.pts7 circle,.circlepts.pts6 circle{stroke-dashoffset:490px;animation:dash6 1s linear forwards}
.circlepts.pts5 circle,.circlepts.pts4 circle{stroke-dashoffset:510px;animation:dash4 1s linear forwards}
.circlepts.pts3 circle,.circlepts.pts2 circle{stroke-dashoffset:530px;animation:dash2 1s linear forwards}
.circlepts.pts1 circle,.circlepts.pts0 circle{stroke-dashoffset:555px;animation:dash0 1s linear forwards}

@keyframes dash20 {from {stroke-dashoffset:340px}to {stroke-dashoffset: 340px;}}
@keyframes dash18 {from {stroke-dashoffset:340px}to {stroke-dashoffset: 360px;}}
@keyframes dash16 {from {stroke-dashoffset:340px}to {stroke-dashoffset: 380px;}}
@keyframes dash14 {from {stroke-dashoffset:340px}to {stroke-dashoffset: 400px;}}
@keyframes dash12 {from {stroke-dashoffset:340px}to {stroke-dashoffset: 425px;}}
@keyframes dash10 {from {stroke-dashoffset:340px}to {stroke-dashoffset: 455px;}}
@keyframes dash8 {from {stroke-dashoffset:340px}to {stroke-dashoffset: 470px;}}
@keyframes dash6 {from {stroke-dashoffset:340px}to {stroke-dashoffset: 510px;}}
@keyframes dash4 {from {stroke-dashoffset:340px}to {stroke-dashoffset: 530px;}}
@keyframes dash2 {from {stroke-dashoffset:340px}to {stroke-dashoffset: 555px;}}
.note-title {float: right;margin: 0 0 0 10px;font-size: 18px;width: 100%;text-align: center}

svg {overflow: hidden;vertical-align: middle}

	.notes{display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;padding:20px;margin:0 0 15px;
    justify-content: space-between;
    background-color: #f8f8f8;border-radius:0 0 15px 15px}
	
	.circleNote {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin: 30px auto 0;
    height: 75px;
    width: 75px;
    border: 5px inset rgba(0, 0, 0, 0.08);
    border-radius: 50px;
}
.circleNote b {
    font-size: 32px;
    text-align: center;
    width: 100%;
    display: block;
}
#reaction-stat-slider-items-ow{    display: flex;
    -ms-flex-direction: column;
    flex-direction: row;
    position: relative;
    -ms-flex-align: center;
    align-items: center;
    width: auto;
    flex-wrap: wrap;}
#reaction-stat-slider-items-ow .reaction-stat{display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    min-width: 45%;margin-bottom: 20px;}
#reaction-stat-slider-items-ow .reaction-stat .reaction-stat-title{margin-top: 5px}
.blocoeuvre{display:flex;align-items: center; border: 1px solid #efefef;border-radius: 15px 15px 0 0; margin-top: 30px}
.list-friends-home .BtAddFollower:after,.list-friends-home .BtAddFollower:before{content:''}
.classicIco.Icopo{position:absolute;top:20px;right:25px;opacity:0.30}
.user-status-icon.classicIco.dossier svg{width:30px;opacity:0.30}
.user-status-icon.classicIco.anew svg{width:25px;opacity:0.2}

.shortcritic{line-height:22px}
.shortcritic strong{font-weight:normal}

.anews{padding:0}
.anews h2{font-size:22px;margin:15px 0}
.anews h3{font-size:20px;margin:15px 0}

.acritic .video-status.small .video-status-info{height:100px}
.acritic .video-status.small .video-status-image{width:100px;height:100px}
.acritic .video-status.small{padding-left:100px}
.acritic .video-status.small .video-status-info{padding:16px 18px 12px}
.acritic .video-status.small .video-status-info .video-status-meta{margin-top:5px}

.aproduct .coltof{display:grid;width:100%;position:absolute;bottom:0}
.aproduct .coltof-4{grid-template-columns: repeat(auto-fit,25%)}
.aproduct .coltof-3{grid-template-columns: repeat(auto-fit,33.3%)}
.aproduct .coltof-2{grid-template-columns: repeat(auto-fit,49.5%)}
.aproduct .coltof div{height:50px;margin:1px;background-size:cover;background-position:center}
.aproduct .imgproduct {min-width: 150px;height: 150px;background-size: cover;background-position: center;border-radius: 15px 0 0 0}
.aproduct .theproduct {margin: 30px 15px 0;background-color: #fdfdfd;align-items: stretch}
.aproduct .theproduct h4{font-size: 1.3em;margin:0 30px}
.aproduct .cntPod{width:100%;position: relative;display: inline-flex;align-items: center;}
.aproduct .cntPod.withtof{margin-top:-50px}
.aproduct .cntPod.withtof  h4{font-size: 1.1em}

	.likecosplay{height:300px;background-size:cover;position: relative}
	.likecosplay .ttlecosplay{width:100%;position: absolute;bottom: 0;background-color: rgba(255,255,255,0.95);padding: 10px;font-weight: bold}
	.notes span{font-size:14px}
	
	.likepodcast{border-radius:15px 15px 0 0;position:relative}
	.likepodcast h4{padding: 0 20px 0 0;font-size: 1.25rem;}
	.likepodcast h5{padding: 0 20px 0 0;font-size: 1rem;}
	.likepodcast .imgpodcast{min-width:140px;height: 140px;border-radius: 15px 0 0 0;margin: 0px 20px 0px 0px;background-size: cover;background-position: center center;}

.grouppodcast{margin:30px 15px 0;background-color: #fdfdfd;align-items:stretch}
.grouppodcast h4{font-size:1.4em}
.grouppodcast .imgpodcast{min-width:150px;height:150px;background-size:cover;background-position:center;border-radius:15px 0 0 0;margin:0 30px 0 0}
.grouppodcast .cntPod{display: inline-flex;flex-direction:column;align-content:space-around;flex-flow:row wrap;font-size:14px;margin-right: 20px;}

.listnotes img{width:32px;margin: 0 3px;}
.listnotes{position:absolute;top:10px;right:10px}
	
.profile-main-loader{
    width: 45px;
	margin:0 auto
}

.profile-main-loader .loader {
  position: relative;
  margin: 0px auto;
  width: 100px;
  height:100px;
  margin-left:-25px;
}
.profile-main-loader .loader:before {
  content: '';
  display: block;
  padding-top: 100%;
}

.circular-loader {
  -webkit-animation: rotate 2s linear infinite;
          animation: rotate 2s linear infinite;
  height: 100%;
  -webkit-transform-origin: center center;
      -ms-transform-origin: center center;
          transform-origin: center center;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  margin: auto;
}

.loader-path {
  stroke-dasharray: 150,200;
  stroke-dashoffset: -10;
  -webkit-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
          animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
  stroke-linecap: round;
}

@-webkit-keyframes rotate {
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes rotate {
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@-webkit-keyframes dash {
  0% {
    stroke-dasharray: 1,200;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 89,200;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 89,200;
    stroke-dashoffset: -124;
  }
}
@keyframes dash {
  0% {
    stroke-dasharray: 1,200;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 89,200;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 89,200;
    stroke-dashoffset: -124;
  }
}
@-webkit-keyframes color {
  0% {
    stroke: #70c542;
  }
  40% {
    stroke: #70c542;
  }
  66% {
    stroke: #70c542;
  }
  80%, 90% {
    stroke: #70c542;
  }
}
@keyframes color {
  0% {
    stroke: #70c542;
  }
  40% {
    stroke: #70c542;
  }
  66% {
    stroke: #70c542;
  }
  80%, 90% {
    stroke: #70c542;
  }
}

#homeprofile{position:relative}
#proh-clg.fix{position:sticky;top: 108px;}
#proh-cld.fix{position:sticky;top: 108px;}

.hbox-univ{margin:0 0 20px 0}
.hbox-univ .grid{grid-template-columns: repeat(auto-fit,50px);display: grid}
.hbox-univ div img{width:40px;margin:0 auto;display:block}
.hbox-univ .progress-b{width:40px;height:8px;border-radius:20px;margin:0 auto;border-style:solid;border-width:1px}
.hbox-univ .pts0 img{opacity:0.1}
.hbox-univ .pts0 .pts{width:0}
.hbox-univ .pts1 .pts{width:24%}
.hbox-univ .pts2 .pts{width:40%}
.hbox-univ .pts3 .pts{width:60%}
.hbox-univ .pts4 .pts{width:80%}
.hbox-univ .pts5 .pts{width:100%}
.hbox-univ .progress-b .pts{height:6px;margin:0 1px 1px 1px;border-radius:20px}

.hbox-stats-like{margin:0 0 20px 0}
.hbox-stats-like .grid{grid-template-columns: repeat(auto-fit,50px);display: grid;margin:0 0 20px 0}
.hbox-stats-like div img{width:40px}

.hbox-groups{margin:0 0 20px}