



.bgtest {
  background-color: rgba( 0, 0, 0, 0.1 );
}
.clickable {
  cursor: pointer;
}
.faded {
  opacity: .5;
}
.disabled {
  opacity: .5;
  pointer-events: none;
}







/* REVIEW DISCUSSION PAGE*/
.jrDiscussion .jr-review-comments  { float:none;}


/*************************************
Cookies
*************************************/
.cc-banner { background:var(--bg-color-dark)!important; opacity:0.93!important; font-size:1.1rem!important; line-height:1.1em!important; }
.cc-message { padding-right:15px; }
.cc-dismiss { border-radius:5px;}
@media only screen and (max-width: 540px) {
  .cc-banner { font-size:1rem!important; }
  .cc-message { padding-right:10px;}
  a.cc-dismiss { min-width:90px!important; }
}
@media only screen and (max-width: 415px) {
  .cc-message {  margin-bottom:5px!important; }
}



/*************************************
Pagination
*************************************/


/* TOP */

.jrPagination {
  mar gin-top:-10px; background:none!important; border:0px; color:var(--text-light); font-size:12px;
 	display:flex;
  align-items:center;
  justify-content: space-between;
  padding:0px!important;
  font-size:1.1rem;
  margin-bottom:-5px;
}
.jrPagenavResults { color:var(--text-light); }
.jrPaginationTop .jrPagenavResults { display: none;}

/* Bottom Pagination */
.jrPaginationBottom { display:flex; }
.jrPaginationBottom .jrPagenavResults { order:3;  }
.jrPaginationBottom .jrPagenavResults .jrPagenavResultsText { float:right; padding-right:10px; }
/**********************/

.jrPagenavResults .jrPagenavResultsText { display:flex; justify-content: flex-start;  }
.jrPagenavLimit .jrOrdering {   display:flex; justify-content: flex-end!important; }

.jrPagenavResults { text-align:left; }
.jrPagenavPages .jrButtonGroup {  float:left;}
.jrPagenavPages .jrButton {margin:0px 5px!important;}

.jrPagenavPages span.jrPageCurrent {
 background:var(--bg-white);
 border:0px;
 color:#666!important;
 font-weight:800!important;
 border-radius:0px;
 padding:5px 10px;
 box-shadow:none;
 border-radius:5px;
 line-height:1.7em;
}
.night .jrPagenavPages span.jrPageCurrent { background:var(--bg-color-lighter); color:#ccc!important; }
.jrPagenavPages .jr-pagenav-page.jrButton {
 background:var(--bg-blank);
 color:var(--text-light)!important;
 border:0px #ddd solid;
 font-weight:800!important;
 border-radius:0px;
 padding:5px 10px;
 border-radius:5px;
 line-height:1.7em;
}
.jrPagenavPages .jr-pagenav-page.jrButton:hover { background:#ddd; color:#fff!important; }
.night .jrPagenavPages .jr-pagenav-page.jrButton:hover { background:var(--bg-color-light)!important; color:#ccc!important; }

.jrPaginationTop {
  margin-bottom:8px;
}
.jrPaginationTop > div.jrPagenavLimit {
  back ground:red;
  text-align:right; padding:0px; margin:0px;
 font-si ze:1.2rem;
 heigh t:30px;
}

/* Ordering */
.jrOrdering { color:#888; font-size:12px; }
.jrOrdering span { font-size:0px;}
.jrOrdering > select { color:var(--text-light); background:#fff; border:0px; }
.night .jrOrdering > select { color:var(--bg-color-lightest); background:var(--bg-color-light);   }

.jrPaginationTop a.jrButton.jrAddListing {
 margin:0px;
 padding:1px 20px;
 border:0px;
}
/* BOTTOM */
.jrPaginationBottom  {
 margin-top: 20px;
 color:#888;
}
.jrPaginationBottom .jrPagenavResults {
 font-size:1.2rem;
}


/* INDIVIDUAL */
.jr-page.jrPage.jrListings .jrPaginationTop {  padding:15px 0px 15px 0px; }


@media only screen and (max-width : 550px) {

  .jrPagenavResults { text-align:center; height:00px; }
}











/* TABS */
ul.nav.nav-tabs.ui-tabs-nav { background:none; display:flex!important; flex-direction:row;  }
.jr-tabs.jrTabs > ul.nav  { padding:0px 20px!important; }
.jr-tabs.jrTabs > ul.nav > li { width:50%!important; }


.jrTabs > ul.nav > li a  {
  back ground:#fff;
  font-weight:800!important;
  font-size:1.2rem!important;
  color:#aaa!important;

  text-transform:uppercase;
  height: 50px;
  line-height: 50px!important;
  letter-spacing:1px;
  transition: all 0.3s ease;
  padding:0px 20px!important; z-index:9999; box-shadow:0px 0px 10px rgba(0,0,0,0.1);
}

.jrTabs > ul.nav > li.ui-tabs-active  > a   {
	box-shadow: none;
  background:#fff;
  box-shadow:0px 0px 10px rgba(0,0,0,0.1); z-index:999; position:relative;
  color:#333!important;
   box-shad ow:0px 3px 15px rgba(0,0,0,0.3);
}

.jrTabs > ul.nav > li.ui-tabs-active:before   {
	backg round:none!important;
}

.jrTabs > ul.nav > li.ui-tabs-active.user a {
  background:#fff;
  border:0px!important;
  border-bottom:5px #A3CF68 solid!important;
  color:#444!important;
 }
.jrTabs > ul.nav > li.ui-tabs-active.editor a {
  background:#fff;
  border:0px!important;
   border-bottom:5px #fecf4b solid!important;
}


@media only screen and (max-width : 500px) {
  .jr-tabs.jrTabs > ul.nav > li {
    width:100%!important;
    margin:0px!important;
    margin-bottom:20px!important;
  }
}


/*************************************
Tabs
************************************
.ui-widget { font-family: inherit;  }
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button { font-family: inherit; }

.jr-tabs.jrTabs > ul.nav {
	backg round:#111;
  border-radius:0px;
  m ax-width:400px;
  ma rgin:0 auto!important;
  borde r-bottom:1px #fff solid;
}
.jr-tabs.jrTabs > ul.nav > li {
  background:none!important;
  border-left:0px;
  border-right:0px;
  border-top:0px;
  bord er-bottom:4px red solid;
  margin:0px 20px 0px 0px!important;
  border-radius:0px;
  -webkit-transition : border 100ms ease-out;
  -moz-transition : border 100ms ease-out;
  -o-transition : border 100ms ease-out;
  transition : border 100ms ease-out;
}
.jr-tabs.jrTabs > ul.nav > li.ui-state-hover {
  border-top:0px;
  border-left:0px;
  border-right:0px;
  bo rder-bottom:4px #f1f1f1 solid!important;
 }
.jr-tabs.jrTabs > ul.nav > li.ui-tabs-active   {
  border-left:0px;
  border-right:0px;
  border-top:0px;
  bord er-bottom:3px #fff solid!important;
  paddi ng:5px 30px;
}
.jr-tabs.jrTabs > ul.nav > li a {
  line-height:30px;
  bac kground:#fff;
  border-radius:0px;
  pad ding:5px 30px!important;
  text-align:center;
  text-transform:uppercase;
  color:#111;
  font-weight:400;
  border:0px;
}
.jr-tabs.jrT abs > ul.nav > li.ui-tabs-active a {
  background:none;
  color:#fff;
}
.jr-t abs.jrTabs > ul.nav > li.ui-tabs-active a:hover { bo rder:0px;}
.jr-tabs.jrTabs > ul.nav > li:hover {  }
.jr-tabs.jrTabs > ul.nav > li:hover > a {  }
.jr-t abs.jrTa bs > ul.nav > li > a:focus {
  background:#fff;
  border-left:0px;
  border-right:0px;
  border-radius:0px;
}


*/




/*************************************
COMPARE TAB
*************************************/
.jrCompareDashboard { background:#fff; box-shadow:0px 0px 3px rgba(50,50,50,0.3);}
.jrCompareDashboard > div.jrCompareHeader { background:#eee;}
.jrCompareDashboard .jrCompareHeader  { background:#fff; border-bottom:1px #ddd solid;  }
.jrCompareDashboard .jrCompareTitle { font-weight:300;}

.jrCompareTabs li.ui-state-default.ui-corner-top.ui-tabs-active { border-radius:0px; border:1px #ccc solid!important;}
.jrCompareTabs li.ui-state-default.ui-corner-top.ui-tabs-active.ui-state-active > a { background:#fff;  }
.jrCompareTabs .jrCompareScroll > ul.ltList > li { background:#fff!important; border-radius:20px!important; padding:5px 5px!important; }
.jrCompareTabs .jrCompareScroll > ul.ltList > li  > div.compareThumb  { border:0px; margin-left:15px;}
.jrCompareTabs .jrCompareScroll > ul.ltList > li a { font-size:1.2rem;  }
.jrCompareTabs .jrCompareScroll > ul.ltList > li > span.removeItem { margin-right:10px; font-size:0px;}
.jrCompareTabs .jrCompareScroll > ul.ltList > li > span.removeItem:before {   content: "\f00d"!important;  font-family: FontAwesome!important; color:#888;  }
.jrCompareTabs #jrCompare1.jrCompareButtons > a { width:100%; padding:3px 5px; margin-top:-5px; margin-bottom:10px!important;}
.jrCompareTabs #jrCompare1.jrCompareButtons > a span:before { top:2px; position:relative;}







/*************
LIGHT & NIGHT TOGGLER
****************/
.toggleWrapper { position: absolute; top: 55%; left: 50%; overflow: hidden; padding: 0 200px; transform: translate3d(-50%, -50%, 0); }
.toggleWrapper input { position: absolute; left: -99em; }
.toggle {
  cursor: pointer;
  display: inline-block;
  position: relative;
  width: 45px;
  height: 25px;
  background-color: #83D8FF;
  border-radius: 84px;
  transition: background-color 200ms cubic-bezier(0.445, 0.05, 0.55, 0.95);     font-weight:bold;
}
.toggle:before {
  content: 'AM';
  position: absolute;
  left: -25px;
  top: 3px;
  font-size: 1.2rem;
  color:#fff;
}
.toggle:after {
  content: 'PM';
  position: absolute;
  right: -25px;
  top: 3px;
  font-size: 1.2rem;
  color: #1b3d80;
}
.toggle__handler {
  display: inline-block;
  position: relative;
  z-index: 1;
  top: 2px;
  left: 2px;
  width: 21px;
  height: 21px;
  background-color: #FFCF96;
  border-radius: 50px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  transition: all 400ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transform: rotate(-45deg);
}
.toggle__handler .crater { position: absolute; background-color: #E8CDA5; opacity: 0; transition: opacity 200ms ease-in-out; border-radius: 100%; }
.toggle__handler .crater--1 { top: 9px; left: 5px; width: 2px; height: 2px; }
.toggle__handler .crater--2 { top: 14px; left: 11px; width: 3px; height: 3px;}
.toggle__handler .crater--3 { top: 5px; left: 12px; width: 4px; height: 4px; }
.star { position: absolute; background-color: #ffffff; transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95); border-radius: 50%; }
.star--1 { top: 5px; left: 18px; z-index: 0; width: 15px; height: 2px; }
.star--2 { top: 9px; left: 14px; z-index: 1; width: 15px; height: 2px; }
.star--3 { top: 14px; left: 20px; z-index: 0; width: 15px; height: 2px; }
.star--4,
.star--5,
.star--6 {
  opacity: 0;
  transition: all 300ms 0 cubic-bezier(0.445, 0.05, 0.55, 0.95);
}
.star--4 { top: 8px; left: 6px; z-index: 0; width: 1px; height: 1px; transform: translate3d(3px, 0, 0); }
.star--5 { top: 16px; left: 17px; z-index: 0; width: 3px; height: 3px; transform: translate3d(3px, 0, 0); }
.star--6 { top: 18px; left: 14px; z-index: 0; width: 1px; height: 1px; transform: translate3d(3px, 0, 0); }

input:checked + .toggle { background-color: #393669;}
input:checked + .toggle:before { color: #393669;   }
input:checked + .toggle:after { color: #FFCF96;  }
input:checked + .toggle .toggle__handler { background-color: #FFE5B5; transform: translate3d(20px, 0, 0) rotate(0);}
input:checked + .toggle .toggle__handler .crater { opacity: 1;}
input:checked + .toggle .star--1 { width: 1px; height: 1px; }
input:checked + .toggle .star--2 { width: 4px; height: 4px; transform: translate3d(-3px, 0, 0); }
input:checked + .toggle .star--3 { width: 1px; height: 1px; transform: translate3d(-4px, 0, 0); }
input:checked + .toggle .star--4,
input:checked + .toggle .star--5,
input:checked + .toggle .star--6 {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
input:checked + .toggle .star--4 { transition: all 300ms 200ms cubic-bezier(0.445, 0.05, 0.55, 0.95); }
input:checked + .toggle .star--5 { transition: all 300ms 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95); }
input:checked + .toggle .star--6 { transition: all 300ms 400ms cubic-bezier(0.445, 0.05, 0.55, 0.95); }

/*************
PAGE LOADER
****************/
/* if page loading, then hide */
 #loading {
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   position: fixed;
   display: block;
   background-color:#161430;
   transition: all 0.3s ease;
   z-index: 9999999999;
   text-align: center;
 }
.loader{position:absolute;width:60px;height:50%; top:50%; left:50%; transform: translate(-50%, -50%); border-radius:50%; display:block;vertical-align:middle}.loader-3 .dot{width:10px;height:10px;background:#e84570;border-radius:50%;position:absolute;top:calc(50% - 5px)}.loader-3 .dot1{left:0;-webkit-animation:dot-jump .5s cubic-bezier(.77,.47,.64,.28) alternate infinite;animation:dot-jump .5s cubic-bezier(.77,.47,.64,.28) alternate infinite}.loader-3 .dot2{left:20px;-webkit-animation:dot-jump .5s .2s cubic-bezier(.77,.47,.64,.28) alternate infinite;animation:dot-jump .5s .2s cubic-bezier(.77,.47,.64,.28) alternate infinite}.loader-3 .dot3{left:40px;-webkit-animation:dot-jump .5s .4s cubic-bezier(.77,.47,.64,.28) alternate infinite;animation:dot-jump .5s .4s cubic-bezier(.77,.47,.64,.28) alternate infinite}@-webkit-keyframes dot-jump{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{-webkit-transform:translateY(-15px);transform:translateY(-15px)}}@keyframes dot-jump{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{-webkit-transform:translateY(-15px);transform:translateY(-15px)}}



/*************************************
Rating Stars
************************************
.jrRatingBarsUser,
.jrRatingBarsUser > div {
  height:12px;
  margin-top:6px;
}
.jrRatingTable .jrRatingStarsUser,
.jrRatingTable .jrRatingStarsEditor,
.jrRatingTable .jrRatingStarsUser div,
.jrRatingTable .jrRatingStarsEditor div {
  background: url(../images/rating_stars.png) 0 0 repeat-x;
  background-size:16px!important;
  height: 16px!important;
  margin-top:1px;
}
.jrRatingTable .jrRatingStarsUser,
.jrRatingTable .jrRatingStarsEditor {  width: 80px;  }
.jrRatingTable .jrRatingStarsUser div {  background-position: 0 -16px; }
.jrRatingTable .jrRatingStarsEditor div { background-position: 0 -32px; }

.ui-stars-star a,
.jrRatingStarsUser,
.jrRatingStarsEditor,
.jrRatingStarsUser div,
.jrRatingStarsEditor div {
  background: url('../images/rating_stars.png') 0 0 repeat-x;
  background-size:14px;
  height: 14px;
}
.jrRatingStarsUser,
.jrRatingStarsEditor {  width: 70px;  }
.jrRatingStarsUser div {  background-position: 0 -14px; }
.jrRatingStarsEditor div { background-position: 0 -28px; }

.ui-stars-star a {
  background: url('../images/rating_stars.png') no-repeat scroll 0px 0px rgba(0, 0, 0, 0)!important;
  background-size:16px!important;
  height:16px!important;
}
.ui-stars-star-hover a, .ui-stars-star-on a {
  background-position: 0px -16px ! important;
}
.jrRatingsSubmission .jrCol.jrRatingCriteria {
  padding:4px 0px;
  text-align:right;
  font-weight:300;
  font-family:'Roboto',sans-serif;
}
.jrRatingsSubmission .jrCol.jrRatingStars { padding:4px 0px}
.jrRatingsSubmission .jrRatingCaption > span {
  position:relative;
  top:5px;
  color:#aaa;
  font-weight:300;
  margin-left:5px;
}
*/


/**
* Flex helpers
*/
.flex-column {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
}
.flex-row {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
}
.flex-wrap {
flex-wrap: wrap;
}
.flex-left {
justify-content: flex-start;
}
.flex-center {
justify-content: center;
}
.flex-right {
justify-content: flex-end;
}
.flex-space {
justify-content: space-between;
}
.flex-around {
justify-content: space-around;
}
.flex-top {
align-items: flex-start;
}
.flex-middle {
align-items: center;
}
.flex-bottom {
align-items: flex-end;
}
.flex-1 {
flex: 1;
}
.flex-2 {
flex: 2;
}
.flex-3 {
flex: 3;
}
.flex-4 {
flex: 4;
}
.flex-5 {
flex: 5;
}
.flex-10 {
flex-basis: 10%;
width: 10%;
}
.flex-20 {
flex-basis: 20%;
width: 20%;
}
.flex-30 {
flex-basis: 30%;
width: 30%;
}
.flex-40 {
flex-basis: 40%;
width: 40%;
}
.flex-50 {
flex-basis: 50%;
width: 50%;
}

/**
* Spacing helpers
*/
.push-top {
margin-top: 1em;
}
.push-right {
margin-right: 1em;
}
.push-bottom {
margin-bottom: 1em;
}
.push-left {
margin-left: 1em;
}
.push-all {
margin: 1em;
}
.pad-top {
padding-top: 1em;
}
.pad-right {
padding-right: 1em;
}
.pad-bottom {
padding-bottom: 1em;
}
.pad-left {
padding-left: 1em;
}
.pad-all {
padding: 1em;
}

/**
* Type helpers
*/
.text-left {
text-align: left;
}
.text-right {
text-align: right;
}
.text-center {
text-align: center;
}
.text-justify {
text-align: justify;
}
.text-top {
vertical-align: top;
}
.text-middle {
vertical-align: middle;
}
.text-bottom {
vertical-align: bottom;
}
.text-baseline {
vertical-align: baseline;
}
.text-uppercase {
text-transform: uppercase;
}
.text-lowercase {
text-transform: lowercase;
}
.text-capitalize {
text-transform: capitalize;
}
.text-underline {
text-decoration: underline;
}
.text-striked {
text-decoration: line-through;
}
.text-italic {
font-style: italic;
}
.text-bold {
font-weight: bold;
}
.text-faded {
opacity: .6;
}
