.nos {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

:root {
  --black:#000000;

  --gray: #929292;
  --gray-light: #E5E5E5;
  --gray-dark: #4B4B4B;
  --gray-dark-hover: #5B5B5B;

  --white:#ffffff;
  --white-gray:#F2F2F2;
  --white-gray-hover:#eeeeee;

  --red: #EB5757;
  --red-light: #FFEEEE;

  --pink: #FF456F;
  --pink-hover: #EF355F;
  --pink-light: #FEE9E4;

  --green: #218c21;




  --deep-blue: #23528D;
  --blue:#466C9C;
  --blue-shadow:#8FAACE;

  --red: #EA2126;
  --red-hover: #C42A2E;
  --light-red: #ffdede;

  --light-bg: #F5F6FA;
  --light-bg-hover: #E9EDFC;

  --deep-gray:#777777;
  --regular-gray:#C4C4C4;
  --light-gray:#EBEBEB;

  --black:#333333;
  --white:#ffffff;
  --light-blue:#DFECFC;

  --green:#218c21;
  --deep-green: #65900A;
  --light-green:#EEFFF3;

  --yellow:#EEB75F;
}

.full {width: 100%;}

.top-highlight-red { box-shadow: inset 0px 330px 0px 0px var(--red); padding-top: 50px; }
.bottom-highlight-white { box-shadow: inset 0px -290px 0px 0px var(--white); }

@media (max-width:1279px){
  .top-highlight-red { box-shadow: inset 0px 330px 0px 0px var(--blue); }
}

/* central viewport, may be diff width */
.centered { max-width: 1150px; margin:0 auto; }

@media (max-width:1190px){
  .centered { max-width: calc(100% - 40px); } /* full width with paddings 20px */
}

/*@media (max-width:1365px){
  .centered { max-width: 1250px; }
}

@media (max-width:1279px){
  .centered { max-width: 1010px; }
}*/

a { transition: .2s; text-decoration: none; }
a:hover { transition: .3s; }

button { border:0; padding:0; outline: none; cursor: pointer; background-color: transparent; transition: .2s; }
button:hover { transition: .3s; }

input.fail, input.fail:focus, input.fail:hover { border:1px solid var(--red) !important; box-shadow: 0px 2px 5px rgba(234, 33, 39, 0.5) !important; transition: .2s; }
textarea.fail, textarea.fail:focus, textarea.fail:hover { border:1px solid var(--red) !important; box-shadow: 0px 2px 5px rgba(234, 33, 39, 0.5) !important; transition: .2s; }

.checkbox-label {
  display: block;
  position: relative;
  padding-left: 40px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 14px;
  line-height: 30px;
  color:var(--black);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.checkbox-label input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkbox-checkmark {
  position: absolute;
  top: 5px;
  left: 10px;
  height: 16px;
  width: 16px;
  background-color:var(--white-gray);
  border: 1px solid var(--gray);
  border-radius: 3px;
  margin-right: 10px;
}

/* On mouse-over, add a grey background color */
.checkbox-label:hover input ~ .checkbox-checkmark {
  border: 1px solid var(--black);
}

/* When the checkbox is checked, add a blue background */
.checkbox-label input:checked ~ .checkbox-checkmark {
  background-color: var(--white);
}

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

/* Show the checkmark when checked */
.checkbox-label input:checked ~ .checkbox-checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.checkbox-label .checkbox-checkmark:after {
  left: 4px;
  top: 2px;
  width: 4px;
  height: 7px;
  border: solid var(--pink);
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.check {
    display: block;
    position: relative;
    width: 16px;
    height: 16px;
    background-color: var(--white-gray);
    border-radius: 5px;
    border: 1px solid var(--gray-light);
    margin-right: 10px;
    transition: 0s;
}

.check-act {
}

.check-act:after {
    left: 5px;
    top: 2px;
    width: 3px;
    height: 7px;
    border: solid var(--pink);
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
    content: "";
    position: absolute;
}

#up{display:flex;align-items:center;justify-content:center;transition:.1s;background-color:var(--white);font-weight:normal;width:48px;height:48px;line-height:48px;text-align:center;border-radius:24px;position:fixed;bottom:-60px;right:20px;z-index:10;text-decoration:none;}
#up svg{width:24px;height:24px; fill: var(--pink);}
#up:hover { background-color:var(--pink-light); }
#up.on{bottom:50px;transition:.7s}

a.btn-link { border:0; padding:0; margin: 0 auto; display: flex; align-items: center; justify-content: center; outline: none; cursor: pointer; transition: .2s; }
a.btn-link:hover { transition: .3s; }

a.btn-pink-v1, button.btn-pink-v1 { height: 40px; max-width: fit-content; text-align: center; padding:0 50px; border-radius: 20px; background-color: var(--pink); color:var(--white); font-size: 14px; font-weight: bold; text-transform: uppercase; }
a.btn-pink-v1:hover, button.btn-pink-v1:hover { background-color: var(--pink-hover); }

a.btn-pink-v2, button.btn-pink-v2 { height: 44px; max-width: fit-content; text-align: center; padding:0 50px; border-radius: 22px; background-color: var(--black); color:var(--white); font-size: 14px; font-weight: bold; text-transform: uppercase; }
a.btn-pink-v2:hover, button.btn-pink-v2:hover { background-color: var(--green); color:var(--white); }

a.btn-pink-v3, button.btn-pink-v3 { height: 40px; max-width: fit-content; text-align: center; padding:0 50px; border-radius: 20px; background-color: var(--white); color:var(--pink); border: 3px solid var(--pink); font-size: 14px; font-weight: bold; text-transform: uppercase; }
a.btn-pink-v3:hover, button.btn-pink-v3:hover { background-color: var(--pink); color:var(--white); }


a.btn-gray, button.btn-gray { height: 40px; transition: .2s; max-width: fit-content; text-align: center; padding:0 50px; border-radius: 20px; background-color: var(--gray-dark); color:var(--white); font-size: 14px; font-weight: bold; text-transform: uppercase; }
a.btn-gray:hover, button.btn-gray:hover { background-color: var(--black); color:var(--white); transition: .2s; }

a.btn-gray-v2, button.btn-gray-v2 { height: 40px; border-radius: 20px; max-width: fit-content; text-align: center; padding:0 50px; background-color: var(--white-gray); color:var(--gray-dark); font-size: 14px; }
a.btn-gray-v2:hover, button.btn-gray-v2:hover { background-color: var(--gray-dark); color:var(--white); }

/* SELECT UI */
.ui-sel { background-color: var(--white-gray); height: 40px; border-radius:50px; width:300px; transition: .2s; }
.ui-sel-list { position: relative; width: 100%; height: 40px; }
.ui-sel-list-tit { cursor:pointer; width: 100%; background-color: var(--white-gray); position: relative; z-index: 0; display: flex; align-items: center; justify-content: space-between; height: 40px; border-radius: 50px; }
.ui-sel-list-tit .inf { text-align: left; display: flex; align-items: center; justify-content: flex-start; width:calc(100% - 45px); }
.ui-sel-list-tit .inf .inf-name { font-size: 14px; color:var(--gray); margin:0 10px 0 20px; white-space: nowrap; }
.ui-sel-list-tit .inf .inf-value { font-size: 14px; color:var(--gray-dark); font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ui-sel-list-tit svg.svg_darr { height: 12px; width: 12px; margin: 15px; fill: var(--black); transition: .2s; }
.ui-sel-list.open .ui-sel-list-tit svg.svg_darr { transition: .2s; transform: rotate(-180deg);}

.ui-sel-list-items { height:auto; border-bottom: 2px solid var(--white); max-height:350px; width:300px; padding-top: 20px; padding-right: 0px; overflow-x: hidden; overflow-y: auto; position: absolute; z-index: 1; top:0px; left:0px; background-color: var(--white-gray); border-radius: 0px 0px 20px 20px; }

.sel-list-input { border-top:1px solid var(--white-gray-hover); width:calc(100% - 0px); padding: 10px 10px; }
.sel-list-input input[type=text] { width:calc(100% - 40px) !important; height: 40px; border-radius: 20px; padding:0 10px; border:0; outline: 0; background-color: var(--white); }

.sel-list-info { display: block; color: var(--gray-dark); text-align: left; font-size: 14px; transition: .2s; width:calc(100% - 0px); padding: 12px 20px; border-top:1px solid var(--white-gray-hover); }

.sel-item { cursor:pointer; text-align: left; font-size: 14px; transition: .2s; width:calc(100% - 0px); padding: 12px 20px; display: flex; align-items: center; justify-content: space-between; height: auto; min-height: 40px; border-top:1px solid var(--white-gray-hover); }
.sel-item:hover { background-color:var(--white-gray-hover); color: var(--green); transition: .2s; }

.ui-sel-list-items::-webkit-scrollbar { width: 8px; }
.ui-sel-list-items::-webkit-scrollbar-track { background: var(--white-gray-hover); box-shadow:inset -4px 0px 0px 1px var(--white-gray), inset 1px 0px 0px 1px var(--white-gray); }
.ui-sel-list-items::-webkit-scrollbar-button {background: transparent; height: 15px;}
.ui-sel-list-items::-webkit-scrollbar-thumb { background: var(--gray); box-shadow:inset -3px 0px 0px 0px #fff; border-radius:16px; }

.ui-sel-list-items { visibility: hidden; opacity: 0; top:0px; transition: .2s; }
.ui-sel-list.open .ui-sel-list-items { visibility: visible; opacity: 1; top:20px; transition: .2s; box-shadow: 0px 10px 10px -10px rgba(0,0,0,0.5); }
.ui-sel-list.open .ui-sel-list-tit { position: absolute; z-index: 2; }

/* reviews count */
.prod-revs { display: flex; align-items: flex-start; justify-content: flex-start; width: fit-content; margin:0 0 25px 0; }
.prod-revs .prod-revs-link { display: flex; align-items: center; justify-content: space-between; width: 100%; margin:0; padding:0; }
.prod-revs .stars { margin-right: 20px; }
.prod-revs .stars svg.act { fill:var(--yellow); }
.prod-revs .prod-revs-cnt { display: flex; align-items: center; justify-content: center; }
.prod-revs .prod-revs-cnt .text { font-size:14px; color:var(--gray-dark); text-decoration: underline; }
.prod-revs .prod-no-revs { font-size:14px; color:var(--gray); margin:20px 0; }


.prod-item-revs { display: flex; align-items: center; justify-content: center; width: calc(100% - 20px); margin:0 auto 20px auto; }
.prod-item-revs .prod-item-list-revs-link { display: flex; align-items: center; justify-content: center; width: 100%; margin:0; padding:0; }
.prod-item-revs .stars { margin-right: 10px; }
.prod-item-revs .prod-item-revs-cnt { display: flex; align-items: center; justify-content: center; }
.prod-item-revs .prod-item-revs-cnt .text { font-size:12px; color:var(--gray); text-decoration: none; }
.prod-item-revs .prod-item-no-revs { font-size:12px; color:var(--gray); }


/* stars svgs block */
.stars{ width:70px; height:14px; display: flex; align-items: center; justify-content: space-between; margin:0; position: relative; }
.stars svg{ width:14px; height:14px; margin:0px;  fill:var(--gray-light); }
.stars svg.act { fill:var(--yellow); }

/* Reviews page */
.site-reveiws .inner.centered { /*max-width: 800px;*/ }
.site-reviews-title-wrapper { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start; margin-bottom: 50px; }
.site-reviews-title-wrapper .site-reviews-title { width:100%; }
button.btn-gray-v2.to-main { margin-right: 20px; height: 40px; border-radius: 20px; }
button.btn-pink-v2.add-site-review-btn { margin-right: 20px; height: 40px; border-radius: 20px; }

button.btn-gray-v2.show-more-btn-site-reviews { height: 40px; border-radius: 20px; margin:30px auto; }

button.btn-gray-v2.show-more-btn-product-reviews { height: 40px; border-radius: 20px; margin:20px auto; display: block; min-width:300px; }
button.btn-pink-v2.add-product-review { height: 44px; border-radius: 22px; min-width: auto; display: block; min-width:300px; margin:20px auto; }

.site-reviews-bt-wrapper { margin: 50px 0; display: flex; align-items: center; justify-content: center; }

/* sort reviews */
.site-reviews-sel-sort { background-color: var(--white-gray); height: 40px; border-radius:50px; max-width:250px; width:calc(50% - 10px); margin-left: 5px; }
.site-reviews-sel-sort-list { position: relative; width: 100%; height: 40px; }
.site-reviews-sel-sort-list-tit { cursor:pointer; width: 100%; position: absolute; z-index: 2; display: flex; align-items: center; justify-content: space-between; height: 40px; border-radius: 50px; }
.site-reviews-sel-sort-list-tit .inf { text-align: left; display: flex; align-items: center; justify-content: flex-start; width:calc(100% - 45px); }
.site-reviews-sel-sort-list-tit .inf .inf-name { font-size: 14px; color:var(--gray); margin:0 10px 0 20px; display: none; }
.site-reviews-sel-sort-list-tit .inf .inf-value { font-size: 14px; color:var(--gray-dark); margin: 0 10px 0 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.site-reviews-sel-sort-list-tit svg.svg_darr { height: 12px; width: 12px; margin: 15px; fill: var(--black); transition: .2s; }
.site-reviews-sel-sort-list.open .site-reviews-sel-sort-list-tit svg.svg_darr { transition: .2s; transform: rotate(-180deg);}

.site-reviews-sel-sort-list-items { height:auto; max-height:350px; width:300px; box-shadow: 0px 5px 10px 5px rgba(128,128,128,0.2); border: 1px solid var(--white); padding-top: 0px; padding-right: 0px; overflow-x: hidden; overflow-y:auto; position: absolute; z-index: 1; top:0px; right:0px; background-color: var(--white-gray); border-radius: 20px 20px 20px 20px; }
.site-reviews-sort-item { cursor:pointer; font-size: 14px; transition: .2s; width:calc(100% - 0px); padding: 0 20px; display: flex; align-items: center; justify-content: space-between; height: 40px; border-top:1px solid var(--white-gray-hover); }
.site-reviews-sort-item:hover { background-color:var(--white-gray-hover); color: var(--green); transition: .2s; }

.site-reviews-sel-sort-list-items::-webkit-scrollbar { width: 8px; }
.site-reviews-sel-sort-list-items::-webkit-scrollbar-track { background: var(--light-gray); box-shadow:inset -4px 0px 0px 1px #fff, inset 1px 0px 0px 1px #fff; }
.site-reviews-sel-sort-list-items::-webkit-scrollbar-button {background: #fff; height: 3px;}
.site-reviews-sel-sort-list-items::-webkit-scrollbar-thumb { background: var(--blue-shadow); box-shadow:inset -3px 0px 0px 0px #fff; border-radius:16px; }

.site-reviews-sel-sort-list-items { visibility: hidden; opacity: 0; top:0px; transition: .2s; }
.site-reviews-sel-sort-list.open .site-reviews-sel-sort-list-items { visibility: visible; opacity: 1; top:50px; right: -1px; transition: .2s; z-index: 9; }


.no-reviews-text { font-size: 13px; color:var(--gray-dark); display: block; margin-bottom: 20px; }

/* List */
.prod-review-item { margin-bottom: 20px; }
.prod-review-item.review-item-reply { width:calc(100% - 30px); padding-left:30px; }

.review-hd { display: flex; align-items: center; justify-content: flex-start; margin-bottom: 10px; }
.review-hd-logo { position: relative; margin-right: 10px; }
.review-hd-logo svg { width:20px; height: 20px; fill:var(--black); }
.review-hd-logo .dot { position: absolute; left: 7px; top: -1px; width:8px; height: 8px; border-radius: 5px; background-color: var(--green); display: block; }
.review-hd-info { display: flex; align-items: flex-start; flex-direction: column; }
.review-hd-info .name { font-size: 13px; font-weight: bold; color:var(--gray-dark); margin-bottom: 5px; }
.review-hd-info .date { font-size: 11px; font-weight: normal; color:var(--gray); }

.review-stars { margin-bottom: 10px; }
.review-stars .stars svg.act { fill:var(--yellow); }

.review-content { font-size: 13px; color:var(--gray-dark); line-height: 20px; margin-bottom:15px; }
.review-content .reply-to { color: var(--gray-dark); font-weight: bold; opacity: 0.9; }

.review-media { display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap; }
.review-media a { display: flex; width:50px; height: 50px; margin:0 5px 5px 0; align-items: stretch; justify-content: center; }
.review-media a img { max-width: 100%; border-radius: 5px; object-fit: cover; border: 1px solid var(--gray-light); }

.review-bt { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; width:100%; }
.review-bt-lt { width:50%; display: flex; align-items: flex-end; justify-content: flex-start; }
.review-reply { font-size: 14px; color: var(--gray-dark); text-decoration: underline; margin-right: 10px; transition: .2s; }
.review-reply:hover { transition:.2s; color: var(--green); }
.review-replies-cnt { font-size: 11px; color:var(--gray); }
.review-bt-rt { width:50%; display: flex; align-items: center; justify-content: flex-end; }
.review-likes { display: flex; align-items: center; justify-content: flex-start; height: 24px; }
.review-like-btn { display: flex; align-items: center; justify-content: flex-start; }
.review-like-btn .svg-wrapper {  margin-right: 5px; width: 20px; height: 20px; display:flex; align-items: center; justify-content: center; border-radius: 50%;}
.review-like-btn .svg-wrapper svg { width: 14px; height: 14px; fill: var(--white);}
.review-like-btn .cnt { font-size: 13px; }
.review-like { margin-right: 10px; }
.review-like .svg-wrapper { background-color: var(--black); }
.review-like .cnt { color: var(--black); }
.review-dislike .svg-wrapper { background-color: var(--gray); }
.review-dislike .cnt { color: var(--gray); }

.review-bt .show-replies { min-width:calc(100% - 0px); margin:0 auto; text-transform: lowercase; margin-top: 20px; }

.review-replies { height: 0; opacity: 0; overflow: hidden; visibility: hidden; transition: .2s; }
.review-replies.act { transition: .2s; height: auto; opacity: 1; visibility: visible; }
.review-replies .hide-replies { min-width:calc(100% - 0px); margin:0 auto; text-transform: lowercase; margin-bottom: 20px; }


/* Form */
.add-review-form { position: fixed; width:100%; height: calc(100% - 50px); padding-top: 50px; background-color: var(--white); z-index: 1; visibility: hidden; opacity: 0; transition: .2s; }
.add-review-form.act { z-index: 100; transition: .2s; opacity: 1; visibility: visible; top: 0; overflow: auto; }
.add-review-form-inner { max-width: 800px; margin:0 auto; width:100%; }
.add-review-form-hd { height: 50px; display: flex; align-items: center; justify-content: space-between; position: fixed; width: 100%; max-width: 800px; background-color: var(--white); top:0; z-index: 13; }
.add-review-form-title { font-size: 14px; color: var(--gray-dark); font-weight: bold; padding:0 20px; }
.add-review-form-hd .close-review-form { width:30px; height: 30px; margin-right: 10px; display: flex; align-items: center; justify-content: center; }
.add-review-form-hd .close-review-form svg { width:16px; height: 16px; fill:var(--gray-dark); }

.add-review-form-rate { display: flex; flex-direction: column; width: calc(100% - 40px); margin:0 auto; }
.add-review-form-rate .product-title { font-size: 14px; color:var(--gray-dark); margin-bottom: 25px; }
.add-review-form-rate .stars { width: 100%; margin-bottom: 25px; }
.add-review-form-rate .stars .star-wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; cursor:pointer; }
.add-review-form-rate .stars .star-wrap svg { margin-bottom: 10px; }
.add-review-form-rate .stars .star-wrap.act svg { fill:var(--yellow); }
.add-review-form-rate .stars .star-wrap .star-info { font-size: 11px; color:var(--gray); }

.add-review-form textarea { border: 1px solid transparent; width:calc(100% - 82px); outline: none; font-size: 14px; color: var(--gray-dark); padding: 20px; /*border: 0;*/ display: block; resize: none; height: 224px; margin:0 auto 20px auto; border-radius: 18px; background-color: var(--white-gray); }

.form-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; width: calc(100% - 40px); margin:0 auto 20px auto; }
.form-row .form-row-label { font-size: 12px; color:var(--gray); width: 100%; padding-left: 20px; margin-bottom: 5px; }
.form-row input { border: 1px solid transparent; width:calc(100% - 2px); /*border:0;*/ outline: none; height: 40px; border-radius: 50px; background-color: var(--white-gray); padding:0 20px; font-size: 14px; color:var(--gray-dark); }
.form-row.username input { width:calc(50% - 52px); }

/*.add-review-form textarea.fail, 
.add-review-form input.fail { background-color: var(--red-light); }*/

.check-wrapper { width:calc(100% - 40px); padding:0 20px; margin:0 auto 20px auto; display: flex; align-items: center; justify-content: flex-start; cursor:pointer; }
.check-wrapper .check { margin-right: 10px; }
.check-wrapper .check-inf { font-size: 12px; color: var(--gray-dark); }

.add-review-form .send-review { min-width:calc(100% - 40px); margin: 0 20px 20px 20px;}
.add-review-form .cancel-review { min-width:calc(100% - 40px); margin: 0 20px 20px 20px; color:var(--gray); }

.add-review-inf { width:calc(100% - 40px); margin: 0 20px 20px 20px; color: var(--gray); font-size:12px; color: var(--gray);}

.review-add-success { display: flex; align-items: center; justify-content: center; padding:50px 0; font-size: 18px; color: var(--black1); text-align: center; }
.moderator-review { padding:10px 20px 20px 20px; }

button.btn-gray-v2.review-load-pic { width: 220px; height: 40px; border-radius: 20px; padding: 0 20px; display: flex; align-items: center; justify-content: center; max-width: auto; margin:0 auto; margin-left:20px; margin-bottom: 20px; position: relative; }
.review-load-pic svg { width:24px; height: 24px; margin: 3px 10px 3px 0; fill:var(--black); transition: .2s; }
button.btn-gray-v2.review-load-pic:hover svg { fill:var(--white); transition: .2s; }
.review-file-input { position: absolute; width:208px; top:0px; left: 0px; height: 40px; background: #ddd; cursor: pointer; opacity:0; filter:alpha(opacity:0); }
.review-file-list { margin:0 0 0 20px; line-height: 24px; }
