/* * { box-sizing: border-box; } */

	.rating-area {
		border: 0px solid black;
		width: 160px;
		display: inline-block;
	}
	.rating-area:not(:checked) > input {
		display: none;
	}
	.rating-area:not(:checked) > label {
		float: right;
		width: 30px;
		padding: 0;
		cursor: pointer;
		font-size: 25px;
		line-height: 25px;
		color: grey;
	}
	.rating-area:not(:checked) > label:before {
		content: '★';
	}
	.rating-area > input:checked ~ label {
		color: gold;
	}
	.rating-area:not(:checked) > label:hover,
	.rating-area:not(:checked) > label:hover ~ label {
		color: gold;
	}
	.rating-area > input:checked + label:hover,
	.rating-area > input:checked + label:hover ~ label,
	.rating-area > input:checked ~ label:hover,
	.rating-area > input:checked ~ label:hover ~ label,
	.rating-area > label:hover ~ input:checked ~ label {
		color: gold;
	}
	.rate-area > label:active {
		position: relative;
	}
	
	/* Виджет просмотра отзывов*/

	@media (max-width: 1000px) {
      .rating__item {
        flex: 0 0 100%;
        max-width: 100%;
      }
	  .rating {
		 max-width: 1000px; 
	  }
    }

    @media (min-width:1000px) and (max-width:1320px) {
      .rating__item {
        flex: 0 0 50%;
        max-width: 50%;
      }
	  .rating {
		 max-width: 1000px; 
	  }
    }

    @media (min-width:1320px) and (max-width:1640px) {
      .rating__item {
        flex: 0 0 30%;
        max-width: 30%;
      }
	  .rating {
		 max-width: 1320px; 
	  }
    }
	
	@media (min-width: 1640px) {
      .rating__item {
        flex: 0 0 30%;
        max-width: 30%;
      }
	  .rating {
		 max-width: 1640px; 
	  }
    }

	.rating {
      position: relative;
      overflow: hidden; 
      margin: 0 auto;
      padding-left: 50px;
      padding-right: 50px;
      padding-bottom: 50px;
      padding-top: 30px;
    }

    .rating__wrapper {
      display: flex;
      transition: transform 0.6s ease;
      padding-left: 5px;
      padding-right: 5px;
      padding-bottom: 20px;
    }

    .rating__item {
      margin-top: 5px;
      padding: 0px 10px 0px 10px;
    }
	
	.rating__star {
		color: var(--work-color);
		font-size: 30px;
	}
	
	.rating__block {
	  background-color: #f5f5f6;
	  border-radius: 10px;
	  height: 100%;
	  padding: 20px 20px 15px 20px;
    }

    .rating__control {
      position: absolute;
      top: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 50px;
      color: #fff;
      text-align: center;
      bottom: 0;
      background: #ffffff;
    }

    .rating__control:hover,
    .rating__control:focus {
      color: #ffffff;
      text-decoration: none;
      outline: 0;
    }

    .rating__control_left {
      left: 0;
    }

    .rating__control_right {
      right: 0;
    }

    .rating__control::before {
      content: '';
      display: inline-block;
      width: 20px;
      height: 20px;
      background: transparent no-repeat center center;
      background-size: 100% 100%;
    }

    .rating__control_left::before {
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23424242' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
    }

    .rating__control_right::before {
      background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23424242' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E");
    }

    .hand__content_header {
      position: relative;
    }

    .rating__content_img {
      display: block;
      height: auto;
      max-width: 80%;
      box-shadow: 0 0 1px black;
      border-radius: 5px;
    }

    .rating__content_section {
      position: absolute;
      bottom: 0;
      left: 0;
      background: #ffb300; 
      color: white;
      padding: 4px 10px;
      font-size: 15px;
      border-radius: 0 0 0 5px;
      margin-left: 20px;
    }

    .rating__content_title {
      font-family: fonts;
      background: transparent;
      color: black;
      white-space: normal;
      font-size: 15px;
      line-height: 1.3;
      padding: 10px 15px;
      margin: 0;
      height: 52px;
    }

    .rating__content_footer {
      background: #f5f5f5;
      display: flex;
      padding: 20px 15px;
      color: #616161;
    }

    .rating__content_avatar {
      flex: 0 0 40px;
      max-width: 40px;
    }

    .rating__content_photo {
      display: block;
      height: auto;
      max-width: 100%;
      border-radius: 50%;
    }

    .rating__content_author {
      margin-left: 8px;
      line-height: 40px;
    }

    .rating__content_icon {
      height: 18px;
      margin-top: 12px;
      margin-left: auto;
    }

    .rating__content_views {
      margin-left: 4px;
      line-height: 40px;
    }

    .rating__indicators {
      position: absolute;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: -1;
      display: flex;
      justify-content: center;
      padding-left: 0;
      margin-right: 15%;
      margin-left: 15%;
      list-style: none;
      margin-top: 0;
      margin-bottom: 0;
    }

    .rating__indicators li {
      box-sizing: content-box;
      flex: 0 1 auto;
      width: 10px;
      height: 10px;
	  border-radius: 20px;
      margin-right: 3px;
      margin-left: 3px;
      text-indent: -999px;
      cursor: pointer;
      background-color: grey;
      background-clip: padding-box;
      opacity: .5;
      transition: opacity .6s ease;
    }

    .rating__indicators li.active {
      opacity: 1;
	  background-color: black;
    }
	
	#tabs-rating {
	margin: 0px 5px 0px 5px;
	}
	.tabs-nav-rating {
		overflow: hidden;
		margin: 0;
		padding: 0;
	}
	.tabs-nav-rating li {
		display: block;
		float: left;
		padding: 0;
		list-style: none;
	}    
	.tabs-nav-rating a {
		display: block;
		padding: 10px 20px;
		border-top: 1px solid #ccc;  
		border-bottom: 1px solid #ccc;
		border-left: 1px solid #ccc;
		background: #edeef0;
		font-size: 16px;
		font-weight: bold;
		text-decoration: none;
		text-align: center;
		color: #000;
	}		
	.tabs-nav-rating li:last-child a {
		display: block;
		border-right: 1px solid #ccc;
	}
	.tabs-nav-rating a.active {
		border-bottom: 1px solid #fff;
		background: #fff;
		color: #000;
	}    
	.tabs-items-rating {
		border: 1px solid #ccc;
		background: #fff;
		margin: -1px 0 0 0;
	}
	.tabs-item-rating {
		padding: 15px;
	}