.reviews-container { width:1200px; margin:0 auto; padding-top:100px; }

.write-a-review-container { width:1000px; margin:0 auto; text-align:left; padding:60px auto;}

.reviews-top-text { margin-top:-10px; margin-bottom:30px; }

.name-column { width:350px; margin-right:50px; float:left; font-size:18px; font-family: 'Apercu Pro', sans-serif;}

.age-column { width:60px; margin-right:50px; float:left; }

.email-column { width:490px; float:left; }

.form-field-text { 
    color: #333;
    font-family: 'Apercu Pro', sans-serif;
    font-size: 16px;
    display:block;
    margin-bottom:10px;
}

.form-field { 
    color: #333;
    font-family: 'Apercu Pro', sans-serif;
    font-size: 16px;
    display: block;
    background: #fff;
    border: 1px solid #eee;
    padding: 10px 20px;
    width: 100%;
}

.form-column { width:100%; }

.form-left-column { width:475px; margin-right:50px; float:left; }
.form-right-column { width:475px; float:left; }

.form-tablet-spacing { display:none; }

/* The container */
.radio-container {
  position: relative;
  padding-left: 35px;
  margin-top:10px;
  margin-bottom: 12px;
  margin-right:10px;
  cursor: pointer;
  font-size: 16px;
  font-weight:normal;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
.radio-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.radio-container:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.radio-container input:checked ~ .checkmark {
  background-color: #ce4c74;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.radio-container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.radio-container .checkmark:after {
 	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}
    
.checkbox-container {
  position: relative;
  padding-left: 35px;
  margin-top:10px;
  margin-bottom: 12px;
  margin-right:10px;
  cursor: pointer;
  font-size: 16px;
  font-weight:normal;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.checkbox-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.checkbox-checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
}

.checkbox-container:hover input ~ .checkbox-checkmark {
  background-color: #ccc;
}


.checkbox-container input:checked ~ .checkbox-checkmark {
  background-color: #ce4c74;
}

.checkbox-checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.checkbox-container input:checked ~ .checkbox-checkmark:after {
  display: block;
}


.checkbox-container .checkbox-checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}    

.radio-container span, .checkbox-container span {
    color: #333;
    font-family: 'Apercu Pro', sans-serif;
    font-size:16px;
    display:inline-block;
    top:3.5px;
    position:relative;
  
}
.star-rating input {
    display: none;
}
.star-rating {
    width: 100%;
    
}
.star-rating label {
    padding: 7px 16px;
    float: right;
    font-size: 26px;
    color: #eee;
    cursor:pointer;
}

.star-rating input:checked ~ label {
    color: #f8a8c8;
}


.star-rating-review input {
    display: none;
}
.star-rating-review {
    width: 100%;
    
}
.star-rating-review label {
    padding: 5px 5px 5px 0;
    font-size: 18px;
    color: #f8a8c8;
}

.review-title { font-size:24px; line-height:26px; font-family: 'Apercu Pro', sans-serif; display:inline-block; margin-bottom:30px; position:relative; }

.review-title::after { position:absolute; content:''; width:80%; height:1px; background-color:#ccc; bottom:-15px; left:10%;}

.review-filter-column { float:left; width:270px; margin-right:40px; }
.review-filter-column-last { float:left; width:270px; }

.review-left-column { float:left; width:300px; margin-right:100px; text-align:left;}
.review-right-column { float:left; width:600px; text-align:left; }

.review-left-field { font-family: 'Apercu Pro', sans-serif; display:block; margin-bottom:10px; font-size:16px; line-height:20px; }

.review-right-field-title { font-family: 'Apercu Pro', sans-serif; display:block; margin-bottom:20px; font-size:24px; font-weight:bold; line-height:26px; }

.review-right-field-product-name { font-family: 'Apercu Pro', sans-serif; display:block; margin-bottom:10px; font-size:18px; line-height:20px;  color:#f36378}

.review-right-field-product-variant { background: #f36378; color:#fff; padding:10px 20px; font-family: 'Apercu Pro', sans-serif; display:inline-block; margin-bottom:10px; font-size:18px;  line-height:20px; }

.review-right-field-review { font-family: 'Apercu Pro', sans-serif; display:block; font-size:16px; line-height:20px; margin-top:30px; }

.review-date-field { float:right;font-family: 'Apercu Pro', sans-serif; display:block; font-size:16px; line-height:20px;  }

.reviews-container hr { margin:30px auto; }

.pink { color:#f8a8c8}

.review-right-column span { display:inline-block; margin:0 30px 40px 0; font-size:24px; }

.pagination {
         display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
}   

.pagination a {   
        font-weight:bold;   
        font-size:18px;   
        color: black;   
        float: left;   
        padding: 8px 16px;   
        text-decoration: none;   
        border:1px solid #ce4c74;   
        font-family: 'Apercu Pro', sans-serif;
}   

.pagination a.active {   
            background-color: #ce4c74;
            color:#fff;
}   

.pagination a:hover:not(.active) {   
        background-color: #ce4c74;
        color:#fff;
        opacity:0.6;
}   

.mobile-tablet-spacing { display:none; }

.no-results { font-family: 'Apercu Pro', sans-serif; font-size:18px; display:block; margin:30px auto; }

.results-reset { position:relative; float:right; top:-40px; }

.results-reset-no-pagination { position:relative; float:right; top:10px; }

/* Tablet */

@media only screen and (min-width: 769px) and (max-width : 1199px) {

.reviews-container { width:769px; margin:0 auto; padding-top:100px; }

.write-a-review-container { width:750px; margin:0 auto; text-align:left; padding:60px auto;}

.name-column { width:250px; margin-right:20px; float:left; font-size:18px; font-family: 'Apercu Pro', sans-serif;}

.age-column { width:60px; margin-right:20px; float:left; }

.email-column { width:400px; float:left; }

.form-field-text { 
    color: #333;
    font-family: 'Apercu Pro', sans-serif;
    font-size: 16px;
    display:block;
    margin-bottom:10px;
}

.form-field { 
    color: #333;
    font-family: 'Apercu Pro', sans-serif;
    font-size: 16px;
    display: block;
    background: #fff;
    border: 1px solid #eee;
    padding: 10px 20px;
    width: 100%;
}

.form-column { width:100%; }

.form-left-column { width:360px; margin-right:30px; float:left; }
.form-right-column { width:360px; float:left; }

.form-tablet-spacing { display:block; margin-bottom:20px; }

.review-filter-column { float:left; width:47.5%; margin:0 1%; }
.review-filter-column-last { float:left; width:47.5%; margin:0 1%; }

.review-left-column { float:left; width:200px; margin-right:50px; text-align:left;}
.review-right-column { float:left; width:500px; text-align:left; }

.mobile-tablet-spacing { display:block; }

.results-reset { position:relative; float:none; top:40px; margin:0 auto 60px auto;}
.results-reset-no-pagination { position:relative; float:none; top:20px; margin:0 auto 60px auto;} 

}

/* Mobile */

@media only screen and (max-width : 768px) {
 
.reviews-container { width:100%; padding:80px 20px; }

.write-a-review-container { width:100%; padding:60px auto;}

.reviews-top-text { margin-top:-10px; margin-bottom:30px; }

.name-column { width:100%; margin-right:0; margin-bottom:20px; float:none; font-size:18px; font-family: 'Apercu Pro', sans-serif;}

.age-column { width:60px; margin-right:0; margin-bottom:20px; float:none; }

.email-column { width:100%; float:none; }

.form-field-text { 
    color: #333;
    font-family: 'Apercu Pro', sans-serif;
    font-size: 16px;
    display:block;
    margin-bottom:10px;
}

.form-field { 
    color: #333;
    font-family: 'Apercu Pro', sans-serif;
    font-size: 16px;
    display: block;
    background: #fff;
    border: 1px solid #eee;
    padding: 10px 20px;
    width: 100%;
}

.form-column { width:100%; }

.form-left-column { width:100%; margin-right:0; float:none; margin-bottom:20px; }
.form-right-column { width:100%; float:none; }

.radio-container span, .checkbox-container span {
    margin-top:10px;
  
}

.review-filter-column { float:left; width:47.5%; margin:0 1%; }
.review-filter-column-last { float:left; width:47.5%; margin:0 1%; }

.review-left-column { float:none; width:100%; margin-right:0; text-align:left; margin-bottom:30px;}
.review-right-column { float:none; width:100%; text-align:left; }

.mobile-tablet-spacing { display:block; }

.results-reset { position:relative; float:none; top:40px; margin:0 auto 40px auto;}
.results-reset-no-pagination { position:relative; float:none; top:20px; margin:0 auto 40px auto;} 
}